<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<style type="text/css">
	body{overflow:auto;}
  thead tr {background-color: ActiveCaption; color: CaptionText;}
  th, td {vertical-align: top; font-family: "宋体", Arial, Helvetica, sans-serif; font-size: 9pt; padding: 3px; }
  table, td {border: 1px solid silver;}
  table {border-collapse: collapse;}
  thead .col0 {width: 20%;}
  thead .col1 {width: 75%;}
	td.col0{font-size:18px;font-weight:bold;color:#f00;}
</style>
<body class="white-bg">
    <table>
      <thead>
        <tr>
          <th class="col0">章节</th>
          <th class="col1">内容</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td class="col0">第3章 基于Nutz 的项目实战</td>
          <td class="col1"><span style="font-family: 宋体; font-size: 18px; text-align: justify; text-indent: 28px;">当前项目采用快速迭代的开发方法，边设计边开发，开发完一个功能就测试一个功能， 循环渐进。每一个完成的功能块，具备可视、可集成和可运行的特点。这种能及时看到运行效 果的开发方法，可以帮助学习者快速获得成就感、培养开发兴趣、树立信心。</span><br /> </td>
        </tr>
        <tr>
          <td class="col0">3.1 Nuz框架简介</td>
          <td class="col1"><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: Times New Roman, serif; font-size: 18px; line-height: 28px; text-align: justify;">Nutz&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">是一组轻便小型的框架集合，各个部分可以被独立使用，</span>Nutz&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">的目标是在不损耗 运行效率的前提下，让&nbsp;</span>JavaEE Web&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">项目的开发人员写更少的代码，因此可以获得更快的开 发速度。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: Times New Roman, serif; font-size: 18px;">Nutz&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">框架有以下特点。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）遵循&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Apache&nbsp;</span>协议，完整开源，永久免费。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）体积小巧（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1M+</span>）且无依赖。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）学习曲线极低，在线的使用手册、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">API&nbsp;</span>文档齐全，在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">QQ&nbsp;</span>群、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz&nbsp;</span>社区提问，可很 快得到回复。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">4</span>）框架集成的功能强大，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Dao&nbsp;</span>比&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Hibernate&nbsp;</span>控制和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">iBatis&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">SQL&nbsp;</span>简便；<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Ioc&nbsp;</span>配置比&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Spring&nbsp;</span>配置简单；<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Mvc&nbsp;</span>具有高可控的路由功能，即将&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTTP&nbsp;</span>的请求路由到用户的 自定义函数，这个过程是高度可定制化的，同时内置了很多常用的路由方式；<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Json&nbsp;</span>提供 轻量级的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">JSON&nbsp;</span>数据转换等优越功能；内置支持表单文件上传以及下载的断点续传；提供各种 帮助函数。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">5</span>）<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz&nbsp;</span>的测试用例覆盖率很高，保证了框架本身的质量。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">6</span>）应用广泛，服务器、<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Android</span>、嵌入式等各种开发场景。</p> </td>
        </tr>
        <tr>
          <td class="col0">3.2 创建Nutz 项目</td>
          <td class="col1">000</td>
        </tr>
        <tr>
          <td class="col0">3.2.1 项目工程结构</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">JavaEE&nbsp;</span>框架技术创建&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Web&nbsp;</span>项目前，最好先规划好项目工程结构，分类科学管理各种资 源。例如采用表&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-1&nbsp;</span>所示的项目工程结构，不同的文件夹或包（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">package</span>）中存放不同类型的 文件资源，详细情况可以参照表中的说明。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Java&nbsp;</span>源代码文件夹&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">src&nbsp;</span>下的是包（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">package</span>），<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">package&nbsp;</span>的命名通常符合下述规则：</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）包名由小写字母和圆点组成</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）包的路径，一般形如：<span class="h1" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-weight: bold; font-size: 18px;">com.</span><span style="margin: 0px; padding: 0px; text-indent: 0px;">公司名</span><span class="h1" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-weight: bold; font-size: 18px;">/</span><span style="margin: 0px; padding: 0px; text-indent: 0px;">团队名</span><span class="h1" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-weight: bold; font-size: 18px;">/</span><span style="margin: 0px; padding: 0px; text-indent: 0px;">个人名</span><span class="h1" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-weight: bold; font-size: 18px;">.</span><span style="margin: 0px; padding: 0px; text-indent: 0px;">项目名</span><span class="h1" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-weight: bold; font-size: 18px;">.</span><span style="margin: 0px; padding: 0px; text-indent: 0px;">分类名……</span>，基本做到见 名知义，比如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">cn.lrw.newsnutz.pojo</span>，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">cn&nbsp;</span>代表中国，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">lrw&nbsp;</span>代表个人，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">newsnutz&nbsp;</span>代表项目名称，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">pojo&nbsp;</span>表示当前包里面存放数据库表<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">/</span>视图对应的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Java&nbsp;</span>类。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s14" style="margin: 0pt; padding: 2pt 0px 0px 47pt; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-1&nbsp;</span>项目工程结构</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><div style='margin:0 auto;width: 900px;'><table cellspacing="0" style="margin: 0px 0px 0px 5.894pt; padding: 0px; vertical-align: top; overflow: visible; font-family: &quot;Microsoft YaHei&quot;;font-size:16px; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 169pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">路 径</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">说 明</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 169pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s23" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-weight: bold; font-size: 9pt;">newsnutz</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">项目名称</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 169pt; border-top-style: solid; border-top-width: 1pt; border-bottom: 1pt solid rgb(250, 211, 180); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">├─<span style="margin: 0px; padding: 0px;">src</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">源码文件夹</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#FAD3B4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(250, 211, 180); border-bottom: 1pt solid rgb(250, 211, 180); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ ├─cn.lrw.newsnutz</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Main&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">包，主模块，存放&nbsp;</span>MainModule<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">，</span>MainSetup&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">类</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#FAD3B4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(250, 211, 180); border-bottom: 1pt solid rgb(250, 211, 180); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ ├─cn.lrw.newsnutz.pojo</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Pojo&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">包，子模块，存放数据库表</span>/<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">视图对应的&nbsp;</span>Java&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">类</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#FAD3B4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(250, 211, 180); border-bottom: 1pt solid rgb(250, 211, 180); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ ├─cn.lrw.newsnutz.module</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Module&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">包，子模块，存放业务逻辑类</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#FAD3B4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(250, 211, 180); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ └─cn.lrw.newsnutz.utils</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Utils&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">包，子模块，存放封装公用方法或属性的类</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 169pt; border-bottom: 1pt solid rgb(218, 237, 243); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">├─<span style="margin: 0px; padding: 0px;">conf</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">存放&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">JS</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">JSON</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">Properties&nbsp;</span>等类型的配置文件</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#DAEDF3" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(218, 237, 243); border-bottom: 1pt solid rgb(218, 237, 243); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ ├─ioc</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">存放诸如数据源的配置文件</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#DAEDF3" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(218, 237, 243); border-bottom: 1pt solid rgb(218, 237, 243); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ └─dao.js</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">数据库配置文件</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#DAEDF3" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(218, 237, 243); border-bottom: 1pt solid rgb(218, 237, 243); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ ├─log4j.properties</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">系统日志配置文件</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#DAEDF3" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(218, 237, 243); border-bottom: 1pt solid rgb(218, 237, 243); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ ├─config.json</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">UEditor&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">的配置文件</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#DAEDF3" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(218, 237, 243); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">│ └─beetl.properties</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Beetl&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">模板配置文件</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 169pt; border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">└─<span style="margin: 0px; padding: 0px;">WebRoot</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Web&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">项目根目录</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt;"><span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">├─error</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">存放异常访问提示页，如&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">403. html</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">404. html&nbsp;</span>等</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt;"><span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">├─include</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">分类存放网页中引用的&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">JS</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">CSS</span>、图像类文件资源</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ ├─css</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;">&nbsp;</td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ ├─js</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;">&nbsp;</td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ ├─img</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;">&nbsp;</td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ ├─easyui</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">EasyUI&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">框架</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ └─ueditor</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">百度提供的可视化&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTML&nbsp;</span>编辑器</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt;"><span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">├─upload</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">存放上传的文件</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt;"><span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">├─WEB-INF</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Java&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">的&nbsp;</span>Web&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">应用的安全目录，自动存放&nbsp;</span>class&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">文件</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ ├─lib</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">存放项目需要的&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">Jar&nbsp;</span>包</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ ├─web</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">存放网站中的网页文件，如&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">htm</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">html</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">jsp&nbsp;</span>等</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom: 1pt solid rgb(153, 252, 164); border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;"><span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;"></span>│ └─web.xml</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Web&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">工程的配置文件</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 18pt;"><td bgcolor="#99FCA4" style="margin: 0px; padding: 0px; width: 169pt; border-top: 1pt solid rgb(153, 252, 164); border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt;"><span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">└─index. html</span></p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">Web&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">工程默认的首页文件</span></p></td></tr></tbody></table></div> </td>
        </tr>
        <tr>
          <td class="col0">3.2.2 准备Jar包和JS库</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">现在项目主要使用表&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-2&nbsp;</span>所示的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Jar&nbsp;</span>包，可以从各自的官方网站下载最新版本，也可以从&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Maven&nbsp;</span>中央仓库查找和下载。<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Maven&nbsp;</span>中央仓库包含了世界上大部分流行的开源项目构件的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Jar&nbsp;</span>包，有很多&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Jar&nbsp;</span>包还提供各种历史版本。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">当前项目还使用到一些常用的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">JS</span>（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">JavaScript</span>）库、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">CSS&nbsp;</span>库文件，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">jquery</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">easyui</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">ueditor&nbsp;</span>等，它们都可以从官方网站下载到本地计算机上，也可以通过&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">BootCDN&nbsp;</span>网站提供的下载地址 下载。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s14" style="margin: 0pt; padding: 2pt 0px 0px 5pt; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-2&nbsp;</span>项目所需的主要&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">Jar&nbsp;</span>包</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><div style='margin:0 auto;width: 900px;'><table cellspacing="0" style="margin: 0px 0px 0px 5.294pt; padding: 0px; vertical-align: top; overflow: visible; font-family: &quot;Microsoft YaHei&quot;;font-size:16px; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s22" style="margin: 0pt; padding: 1pt 0px 0px 25pt; font-family: Arial, sans-serif; font-size: 9pt;">Jar&nbsp;<span class="s16" style="margin: 0px; padding: 0px; font-family: 黑体, monospace; font-size: 9pt;">包的名称</span></p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">说 明</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">Nutz</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">一组轻便小型的框架集合</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">mysql-connector-java</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">MySQL&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">数据库驱动</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">druid</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">数据库连接池&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">Druid</span>，带强大的监控功能</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">Log4j</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">用&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">Java&nbsp;</span>编写的可靠，快速和灵活的日志框架</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">beetl</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">一款超高性能的&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">Java&nbsp;</span>模板引擎</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">shiro</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">用于认证、授权、加密、会话管理、与&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">Web&nbsp;</span>集成、缓存等</p></td></tr><tr style="margin: 0px; padding: 0px; height: 29pt;"><td style="margin: 0px; padding: 0px; width: 101pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">ueditor</p></td><td style="margin: 0px; padding: 0px; width: 322pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 1pt 5pt 0px; font-family: 宋体; font-size: 9pt; line-height: 12pt;">百度在线编辑器。依赖&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">json.jar</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">commons-codec-1.10.jar</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">commons-io-2.4.jar</span>、&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">commons-fileupload-1.3.3.jar</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">commons-lang3-3.2.1.jar</span></p></td></tr></tbody></table></div><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">建议建一个专门的文件夹，把下载的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Jar&nbsp;</span>包和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">JS&nbsp;</span>库、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">CSS&nbsp;</span>库等资源集中存放，便于以后 其他项目的开发。</p> </td>
        </tr>
        <tr>
          <td class="col0">3.2.3 新建Web项目</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 26pt; font-size: 18px;"></p><p><span style="font-family:宋体;">运行</span>MyEclipse2015<span style="font-family:宋体;">，选择</span>File<span style="font-family:宋体;">菜单中的</span>New…<span style="font-family:宋体;">，点击</span>Web Project<span style="font-family:宋体;">，打开</span>New Web Project<span style="font-family:宋体;">窗口，如图</span>3-1<span style="font-family:宋体;">所示，设置基本参数。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>Project name<span style="font-family:宋体;">：输入适当的项目名称，比如</span>newsnutz<span style="font-family:宋体;">，建议项目名称由字母或字母数字组成，名称短小但见名知义。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>JavaEE version<span style="font-family:宋体;">：选择</span>MyEclipse2015<span style="font-family:宋体;">中最新的</span>JavaEE7<span style="font-family:宋体;">，对应</span>web3.1<span style="font-family:宋体;">的版本。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>Java version<span style="font-family:宋体;">：选择本机安装的</span>1.8<span style="font-family:宋体;">版本。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>JSTL version<span style="font-family:宋体;">：由于当前项目，不使用</span>jsp<span style="font-family:宋体;">页面，所以</span>JSTLversion<span style="font-family:宋体;">选择</span>none<span style="font-family:宋体;">，也就是不需要</span>JSTL<span style="font-family:宋体;">支持。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>Target runtime<span style="font-family:宋体;">：选择运行环境为本机安装的</span>Tomcat8.0<span style="font-family:宋体;">。</span></p><br /><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 26pt; font-size: 18px;"><br /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 84pt; text-indent: 0px;  font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_016.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 3pt 0px 0px 5pt; text-indent: 0px; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">3-1 New Web Project&nbsp;</span>窗口</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-size: 18px; line-height: 28px; text-align: justify;">设置完成上述参数后，单击&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Next</span>，进入源文件夹（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Source Folder</span>）配置窗口，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">3-2&nbsp;</span>所 示。在当前窗口，可以看到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">src&nbsp;</span>中的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">java&nbsp;</span>文件在经过编译后，默认输出文件夹（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Default Output Folder</span>）为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">WebRoot\WEB-INF\classes</span>。根据项目工程结构，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">conf&nbsp;</span>文件夹中的配置文件也应该 输出到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">WebRoot\WEB-INF\classes&nbsp;</span>目录，所以在这个窗口中，单击&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Add Folder</span>，添加文件夹&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">conf</span>。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 97pt; text-indent: 0px;  font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_017.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 3pt 0px 0px 5pt; text-indent: 0px; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">3-2 Source folders on build path&nbsp;</span>窗口</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-size: 18px; line-height: 28px;">存放配置文件的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">conf&nbsp;</span>文件夹添加完成后，单击&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Next&nbsp;</span>按钮进入模块配置（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Web Module</span>）窗 口，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">3-3&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 97pt; text-indent: 0px;  font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_018.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 5pt 0px 0px 4pt; text-indent: 0px; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">3-3 Web Module&nbsp;</span>窗口</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-size: 18px; line-height: 28px;">在模块配置窗口，勾选&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Generate web.xml deployment descriptor</span>，单击&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Finish</span>，生成以&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">newsnutz&nbsp;</span>为名称的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Web&nbsp;</span>项目，项目结构如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">3-4&nbsp;</span>所示，其中在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">WebRoot\WEB-INF&nbsp;</span>目录下可以 看到自动生成的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Web&nbsp;</span>项目配置文件&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">web.xml</span>。此文件主要用于配置欢迎页&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">welcome-file</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Filter</span>、&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Listener</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Servlet&nbsp;</span>等。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 142pt; text-indent: 0px;  font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_019.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; text-indent: 0px; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">3-4&nbsp;</span>项目结构</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-size: 18px; line-height: 28px; text-align: justify;">将准备好的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">Jar&nbsp;</span>包添加到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">WebRoot/WEB-INF/lib&nbsp;</span>目录下，效果如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">3-5&nbsp;</span>所示。百度编辑器 的压缩包中包含了&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">commons-fileupload-1.3.1.jar</span>，百度官方声称&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">commons-fileupload-1.3.1.jar&nbsp;</span>存 在漏洞可能会导致&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">DDoS&nbsp;</span>攻击，强烈推荐升级至最新版本&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px;  font-size: 18px;">commons-fileupload-1.3.3.jar</span>。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 139pt; text-indent: 0px;  font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_020.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 47pt; text-indent: 0px; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">3-5&nbsp;</span>添加了&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">Jar&nbsp;</span>包的&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">lib&nbsp;</span>目录</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 0px; font-size: 18px; text-align: center;">参照“项目工程结构”添加包（<span class="s6" style="margin: 0px; padding: 0px;  font-size: 18px;">package</span>）和其他文件夹，完成效果如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px;  font-size: 18px;">3-6&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px;  font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 153pt; text-indent: 0px;  font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_021.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; text-indent: 0px; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px;  font-size: 9pt;">3-6&nbsp;</span>项目结构</p>  </td>
        </tr>
        <tr>
          <td class="col0">3.2.4 添加数据源</td>
          <td class="col1"><p><span style="font-family:宋体;">利用可视化工具</span>HeidiSQL<span style="font-family:宋体;">，创建数据库</span><strong><span style="color:red;">dbnews1</span></strong><span style="font-family:宋体;">，特别注意在创建数据库时，保证数据库的字符集是</span>utf8<span style="font-family:宋体;">，选择</span>Collation<span style="font-family:宋体;">的值</span><strong><span style="color:red;">utf8_general_ci</span></strong><span style="font-family:宋体;">，如图</span>3-7<span style="font-family:宋体;">所示。</span></p><p><img th:src="@{/assets/javaeeimg/Image_022.png}" alt="" /></p><p><span style="font-family:宋体;">图</span>3-7<span style="font-family:宋体;">新建数据库</span></p><p><span style="font-family:宋体;">软件国际化是大势所趋，所以</span>Unicode<span style="font-family:宋体;">是国际化最佳的选择。</span>MySQL<span style="font-family:宋体;">有两个支持</span>Unicode<span style="font-family:宋体;">的</span>character set<span style="font-family:宋体;">，</span>ucs2<span style="font-family:宋体;">和</span>utf8<span style="font-family:宋体;">，一般选择</span>utf8<span style="font-family:宋体;">。</span></p><p><span style="font-family:宋体;">每个</span>characterset<span style="font-family:宋体;">会对应一定数量的</span>collation<span style="font-family:宋体;">，</span>collation<span style="font-family:宋体;">即比对方法，用于指定数据集如何排序，以及字符串的比对规则。</span></p><p>collation<span style="font-family:宋体;">名字的规则可以归纳为这两类：</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>&lt;character set&gt;_&lt;language/other&gt;_&lt;ci/cs&gt;</p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>&lt;character set&gt;_bin</p><p><span style="font-family:宋体;">例如：</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>utf8_ general _ci</p><p>ci<span style="font-family:宋体;">是</span>case insensitive<span style="font-family:宋体;">的缩写，</span>cs<span style="font-family:宋体;">是</span>casesensitive<span style="font-family:宋体;">的缩写。即，指定大小写是否敏感。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>utf8_bin</p><p><span style="font-family:宋体;">是将字符串中的每一个字符用二进制数据存储，区分大小写。</span></p><p><span style="font-family:宋体;">选择了</span>Collation<span style="font-family:宋体;">，也就确定了字符集。例如选择</span>utf8_ general _ci<span style="font-family:宋体;">，就确定了字符集是</span>utf8<span style="font-family:宋体;">。</span></p><p><span style="font-family:宋体;">创建数据库以后，根据第</span>2<span style="font-family:宋体;">章中表</span>2-1<span style="font-family:宋体;">所示的表结构，在</span>dbnews1<span style="font-family:宋体;">数据库中创建</span><strong><span style="color:red;">user</span></strong><span style="font-family:宋体;">表，如图</span>3-8<span style="font-family:宋体;">所示：</span></p><p><img th:src="@{/assets/javaeeimg/Image_023.png}" class="wordImage" width="430" height="260" alt="" /></p><p><span style="font-family:宋体;">图</span>3-8<span style="font-family:宋体;">创建</span><strong><span style="color:red;">user</span></strong><span style="font-family:宋体;">表</span></p><p><span style="font-family:宋体;">根据第</span>2<span style="font-family:宋体;">章中表</span>2-2<span style="font-family:宋体;">所示的</span>news<span style="font-family:宋体;">表结构、表</span>2-3<span style="font-family:宋体;">所示的</span>cmenu<span style="font-family:宋体;">表结构，用类似的方法在</span>dbnews1<span style="font-family:宋体;">数据库中创建</span>news<span style="font-family:宋体;">表、</span>cmenu<span style="font-family:宋体;">表。</span></p><p>cmenu<span style="font-family:宋体;">中数据的组织是按</span>id<span style="font-family:宋体;">和</span>pid<span style="font-family:宋体;">标识层次关系，</span>name<span style="font-family:宋体;">值为显示在界面上菜单名称，</span>url<span style="font-family:宋体;">为请求打开指定功能的页面的路径，</span>permission<span style="font-family:宋体;">设定为指定角色的用户才能看到相应的菜单项。目前可以指定以下菜单栏目，由于系统简化了功能，这一部分数据，如表</span>3-3<span style="font-family:宋体;">所示，通过</span>HeidiSQL<span style="font-family:宋体;">等可视化工具直接录入数据库的</span>cmenu<span style="font-family:宋体;">表。</span></p><p><span style="font-family:黑体;">表</span>3-3 cmenu<span style="font-family:黑体;">表数据</span></p><div><table border="1" cellspacing="0" cellpadding="0" width="511"> <thead>  <tr><td style="width:47.25pt;"><p>id</p></td><td style="width:62.25pt;"><p>pid</p></td><td style="width:89.35pt;"><p>name</p></td><td style="width:99.25pt;"><p>url</p></td><td style="width:3.0cm;"><p>permission</p></td></tr></thead> <tbody><tr><td style="width:47.25pt;"><p>1</p></td><td style="width:62.25pt;"><p>0</p></td><td style="width:89.35pt;"><p><span style="font-family:宋体;">新闻管理</span></p></td><td style="width:99.25pt;"><p>&nbsp;</p></td><td style="width:3.0cm;"><p>1</p></td></tr><tr><td style="width:47.25pt;"><p>2</p></td><td style="width:62.25pt;"><p>1</p></td><td style="width:89.35pt;"><p><span style="font-family:宋体;">新闻列表</span></p></td><td style="width:99.25pt;"><p>/news/goList</p></td><td style="width:3.0cm;"><p>1</p></td></tr><tr><td style="width:47.25pt;"><p>3</p></td><td style="width:62.25pt;"><p>1</p></td><td style="width:89.35pt;"><p><span style="font-family:宋体;">添加新闻</span></p></td><td style="width:99.25pt;"><p>/news/goAdd</p></td><td style="width:3.0cm;"><p>1</p></td></tr></tbody></table></div><p>&nbsp;</p><p><span style="font-family:宋体;">在</span>conf/ioc<span style="font-family:宋体;">创建</span><span style="color:red;">dao.js</span><span style="font-family:宋体;color:red;">文件</span><span style="font-family:宋体;">，该文件的主要作用是创建</span>dataSource<span style="font-family:宋体;">，配置项及说明如图</span>3-9<span style="font-family:宋体;">所示。这是</span>Nutz<span style="font-family:宋体;">项目中最常见的配置方式，由</span>NutIoc<span style="font-family:宋体;">来管理</span>dataSource<span style="font-family:宋体;">和</span>NutDao<span style="font-family:宋体;">的实例</span>dao<span style="font-family:宋体;">。</span></p><p>JavaEE<span style="font-family:宋体;">的很多项目中，用到<strong>控制反转</strong></span><strong>IoC</strong><span style="font-family:宋体;">，</span>IoC<span style="font-family:宋体;">是</span>Inversion ofControl<span style="font-family:宋体;">的缩写，是面向对象编程中的一种设计思想，可以用来减低计算机代码之间的耦合度。是将对象的控制权进行转移，转移给</span>IoC<span style="font-family:宋体;">容器，不直接在对象内部通过</span>new<span style="font-family:宋体;">进行创建对象，不再是程序主动去创建依赖对象，由</span>Ioc<span style="font-family:宋体;">容器查找及注入依赖对象，对象只是被动的接受依赖对象。</span></p><p>Nutz.Ioc<span style="font-family:宋体;">是将一部分关于对象的依赖关系单独存储在某种介质里，并且提供一个接口帮助使用者获得这些对象。</span>Nutz.Ioc <span style="font-family:宋体;">核心逻辑并没有限定配置信息的存储方式，但它还是提供了一个默认的</span>JSON<span style="font-family:宋体;">或者</span>JS<span style="font-family:宋体;">配置文件，选择</span>JSON<span style="font-family:宋体;">格式，有两个优点：</span></p><p>(1)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">省却了</span> XML <span style="font-family:宋体;">书写的烦恼</span></p><p>(2)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">避免了硬编码，当修改了配置时，不需要重新编译工程</span></p><p><img th:src="@{/assets/javaeeimg/Image_024.png}" class="wordImage" width="567" height="295" alt="" /></p><p><span style="font-family:宋体;">图</span>3-9<span style="font-family:宋体;">创建</span>dataSource</p><p><span style="font-family:宋体;">在配置过程中，根据项目数据库的实际情况，正确设置数据库的驱动、地址、端口、数据库名、用户名和密码。</span></p><p><span style="font-family:宋体;">在设定时区的时候，如果设定</span><span style="color:red;">serverTimezone=UTC</span><span style="font-family:宋体;">，会比中国时间早</span><strong><span style="color:red;">8</span></strong><span style="font-family:宋体;">个小时；所以在中国，可以设置</span><span style="color:red;">serverTimezone=Hongkong</span></p><p><span style="font-family:宋体;">高版本</span>MySQL<span style="font-family:宋体;">，版本号高于</span>5.7<span style="font-family:宋体;">，需要指明是否进行</span>SSL<span style="font-family:宋体;">连接，如果不需要</span>SSL<span style="font-family:宋体;">连接，则设定参数</span><span style="color:red;">useSSL=false</span><span style="font-family:宋体;">，否则会在在</span>console<span style="font-family:宋体;">显示如下信息：</span></p><p><strong><span style="color:#E36C0A;background:white;">WARN: Establishing SSL connection withoutserver’s identity verification is not recommended</span></strong></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.2.5 DAO注解</td>
          <td class="col1"><ul id="l9" style="margin: 0px; padding: 0px 0px 0px 0pt; font-family: microsoft yahei; font-size:16px"><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; line-height: 17.12px; text-align: left;"></li><li style="text-indent: 28px;"><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">在下一节开始将要涉及</span>Java<span style="font-family: 宋体;">类文件了，</span>Java<span style="font-family: 宋体;">类中会经常见到注解（</span>Annotation<span style="font-family: 宋体;">），注解在</span>Java<span style="font-family: 宋体;">类的应用，使得编程更加简洁、代码更加清晰。</span>Java<span style="font-family: 宋体;">注解是从</span>JDK1.5<span style="font-family: 宋体;">引入的，注解目前非常的流行，很多主流框架都支持注解，而且自己编写代码的时候也会尽量的去使用注解。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;">1.&nbsp;<span style="font-family: 宋体;">注解的定义</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">注解，它是一种代码级别的说明，与类、接口、枚举是在同一个层次，它可以声明在包、类、字段、方法、局部变量、方法参数等的前面，用来对这些元素进行说明、注释。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;">2.&nbsp;<span style="font-family: 宋体;">注解的分类</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">（</span>1<span style="font-family: 宋体;">）按照运行机制划分：</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">源码注解：只在源码中存在，编译成</span>.class<span style="font-family: 宋体;">文件就不存在了。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">编译时注解：在源码和</span>.class<span style="font-family: 宋体;">文件中都存在。如</span>@Override<span style="font-family: 宋体;">、</span>@Deprecated<span style="font-family: 宋体;">、</span>@SuppressWarnings<span style="font-family: 宋体;">都属于编译时注解。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">运行时注解：在运行阶段起作用，如</span>@Autowired<span style="font-family: 宋体;">自动注入，在程序运行时把成员变量自动的注入进来。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">（</span>2<span style="font-family: 宋体;">）按照来源划分：</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span>JDK<span style="font-family: 宋体;">的注解，主要有</span>3<span style="font-family: 宋体;">个</span>@Deprecated<span style="font-family: 宋体;">、</span>@Override<span style="font-family: 宋体;">、</span>@SuppressWarnings<span style="font-family: 宋体;">。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">第三方的注解，如</span>@Autowired<span style="font-family: 宋体;">、</span>@Inject<span style="font-family: 宋体;">、</span>@Table<span style="font-family: 宋体;">。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">自定义注解，根据需要，自己定义一些注解。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">元注解：元注解是给注解进行注解，可以理解为注解的注解，包括</span>@Retention<span style="font-family: 宋体;">、</span>@Documented<span style="font-family: 宋体;">、</span>@Target<span style="font-family: 宋体;">、</span>@Inherited<span style="font-family: 宋体;">、</span>@Repeatable<span style="font-family: 宋体;">。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">（</span>3<span style="font-family: 宋体;">）按照参数的个数划分：</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">标记注解，没有参数</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">单值注解，如果单值的名称是</span>value<span style="font-family: 宋体;">，则在使用时可以省略“</span>value=<span style="font-family: 宋体;">”，直接写单值。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: Wingdings;">n<span style="font-size: 7pt; font-family: Times New Roman;">&nbsp;&nbsp;</span></span><span style="font-family: 宋体;">完整注解，定义注解时，一般会包含一些可以设置默认值的元素。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">注解的语法比较简单，除了</span>@<span style="font-family: 宋体;">符号的使用之外，它基本与</span>Java<span style="font-family: 宋体;">固有语法一致，比如</span>@Override<span style="font-family: 宋体;">，表示当前定义的方法将覆盖超类或接口中的方法。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">主流框架已经定义了很多便于使用的注解，我们更多地是关注它们的使用。使用注解最主要的部分在于对注解的处理</span>(<span style="font-family: 宋体;">注解处理器</span>)<span style="font-family: 宋体;">，注解处理器就是通过反射机制获取被检查类或方法上的注解信息，然后根据注解元素的值进行特定的处理。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 宋体;">我们首先了解一下</span>Nutz<span style="font-family: 宋体;">框架中如表</span>3-4<span style="font-family: 宋体;">所示</span>Dao<span style="font-family: 宋体;">支持的注解。</span></p><p style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><span style="font-family: 黑体;">表</span>3-4 Nutz.Dao<span style="font-family: 黑体;">支持的全部注解</span></p><div style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"><table border="1" cellspacing="0" cellpadding="0" width="391"><tbody><tr><td style="width: 123.5pt;"><p><strong><span style="font-size:18px;color:#ff0000;"><span style="font-family: 黑体;">注</span>&nbsp;&nbsp;<span style="font-family: 黑体;">解</span></span></strong></p></td><td style="width: 6cm;"><p><span style="font-weight: bold;"><span style="font-size:18px;color:#ff0000;"><span style="font-family: 黑体;">说</span>&nbsp;&nbsp;<span style="font-family: 黑体;">明<span id="_xhe_cursor"></span></span></span></span></p></td></tr><tr><td style="width: 123.5pt; height: 15pt;"><p>@Column</p></td><td style="width: 6cm; height: 15pt;"><p><span style="font-family: 宋体;">字段</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@ColDefine</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">字段精确定义</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Default</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">默认值</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@EL</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">字段表达式宏</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Id</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">数值主键</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Name</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">字符主键</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@PK</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">复合主键</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Many</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">一对多映射</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@ManyMany</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">多对多映射</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@One</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">一对一映射</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Prev</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">自动设置</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Next</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">自动获取</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Readonly</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">只读声明</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@SQL</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">字段</span>SQL<span style="font-family: 宋体;">宏</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Table</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">表名</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@View</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">视图名</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@TableMeta</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">表设置</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@TableIndexes</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">表索引</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Index</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">具体的索引内容</span></p></td></tr><tr><td style="width: 123.5pt;"><p>@Comment</p></td><td style="width: 6cm;"><p><span style="font-family: 宋体;">表或者字段的注释</span></p></td></tr></tbody></table><br /></div><span id="_xhe_cursor" style="font-family: &quot;Microsoft YaHei&quot;;font-size:16px;"></span><br /></li><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; text-align: left;"></li></ul>  </td>
        </tr>
        <tr>
          <td class="col0">3.2.6 添加POJO类</td>
          <td class="col1"><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: Times New Roman, serif; font-size: 18px; line-height: 28px; text-align: justify;">Pojo<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">（</span>Plain Ordinary Java Object<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）是指简单的&nbsp;</span>Java&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">对象，实际就是普通&nbsp;</span>JavaBeans<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">，仅包 含属性及其&nbsp;</span>getter/setter&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">方法的类，没有业务逻辑，可以理解为简单的实体类，用于封装数据 库中的数据表，</span>POJO&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">类对象可以方便地调用其&nbsp;</span>getter/setter&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">方法。</span></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">cn.lrw.newsnutz.pojo&nbsp;</span>包中创建&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">user&nbsp;</span>数据库表对应的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">User</span>，然后添加表中字段 对应的属性和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">getter/setter&nbsp;</span>方法。可以借助第三方工具，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">MagicalTools</span>，批量自动生成数据库 中大量表<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">/</span>视图对应的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类，这样可以大幅度减少编写代码的时间，提高开发效率。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">可以通过“附录 在线资源”中提供的网址，下载&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">MagicalTools&nbsp;</span>工具。如果已经下载，运 行&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">MagicalTools&nbsp;</span>目录中的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">run.bat&nbsp;</span>程序，将会打开一个可视化窗口，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-10&nbsp;</span>所示。在窗口中 进行以下操作，可批量快速生成&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_025.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p style="margin: 0pt; padding: 3pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt; text-align: center;"><span style="font-family: 宋体; font-size: 9pt;">图&nbsp;</span><span class="p" style="font-size: 9pt; margin: 0pt; padding: 0px;">3-10 MagicalTools&nbsp;</span><span style="font-family: 宋体; font-size: 9pt;">工具自动生成&nbsp;</span><span class="p" style="font-size: 9pt; margin: 0pt; padding: 0px;">POJO&nbsp;</span><span style="font-family: 宋体; font-size: 9pt;">类</span><br /></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">操作步骤：</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）选择服务名&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">mysql</span>。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）根据实际情况修改&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">URL&nbsp;</span>地址中的端口号，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3066</span>，已经存在的数据库&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">mysql</span>。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）输入连接&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">MySQL&nbsp;</span>数据库系统的密码，然后单击“连接”按钮。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">4</span>）连接成功后，会在数据库列表中显示&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">MySQL&nbsp;</span>中的数据库名称，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">dbnews1</span>。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">5</span>）选择&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">dbnews1</span>，就会显示&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">dbnews1&nbsp;</span>中的所有表和视图，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">user</span>、<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">news</span>、<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">cmenu</span>。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">6</span>）选择需要生成&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">pojo&nbsp;</span>的表和视图，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">user</span>，也可以选择全部。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">7</span>）选择模板列表中的模板“<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">java&nbsp;</span>实体<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">.tpl</span>”，也可以参照已有的模板或自定义新的模板， 如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">nutzpojo.tpl</span>。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">8</span>）输入项目包名，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">cn.lrw.newsnutz.pojo</span>。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">9</span>）单击“生成代码”按钮。将在默认的保存路径&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">C:\dbinfo\entities&nbsp;</span>下生成&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类文件， 如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">User.java</span>。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">10</span>）把生成的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类文件复制到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">MyEclipse&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">newsnutz&nbsp;</span>项目的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">cn.lrw.newsnutz.pojo</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; font-family: 宋体; font-size: 18px;">包中。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">11</span>）打开&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类文件，注意&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类中使用的注解，如<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Table</span>，<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Column</span>，<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Id</span>，</p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 18px;">@Name<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">12</span>）数据库表中的字段对应到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类中的属性，属性前的注解通常是<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Column</span>，标 记为字段。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">13</span>）修改、生成&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">POJO&nbsp;</span>类文件。</p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: Times New Roman, serif; font-size: 18px; line-height: 28px;">1<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）“主键”属性前的注解应该为</span>@Id (<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">数值型主键</span>)<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">或</span>@Name (<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">字符型主键</span>)<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">，如图&nbsp;</span>3-11&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">所 示，新闻的&nbsp;</span>id&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">是整数类型，所以注解修改为</span>@Id<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">。</span></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 138pt; font-family: Times New Roman, serif; font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_026.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 6pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">3-11 MagicalTools&nbsp;</span>生成的&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">POJO&nbsp;</span>类</p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 26pt; font-family: Times New Roman, serif; font-size: 18px;">2<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）将属性&nbsp;</span>tjdate&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">的日期类型&nbsp;</span>java.sql.Timestamp&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">修改为&nbsp;</span>java.util.Date<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">，还要相应修改&nbsp;</span>tjdate</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; font-family: 宋体; font-size: 18px;">的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">getter/setter&nbsp;</span>方法。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">修改之后，如果文件中报错，使用快捷键&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Ctrl+Shift+O&nbsp;</span>自动整理&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">import&nbsp;</span>引入的包，消除 报错。修改完成后，保存文件。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">补充：在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Web&nbsp;</span>开发中，避免不了对日期的操作，要注意表&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-5&nbsp;</span>所示的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">4&nbsp;</span>种常见日期类的 区别。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s14" style="margin: 0pt; padding: 0px 0px 0px 21pt; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-5 Java&nbsp;</span>日期类的区别</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><div style='margin:0 auto;width: 900px;'><table cellspacing="0" style="margin: 0px 0px 0px 5.29399pt; padding: 0px; vertical-align: top; overflow: visible; font-family: &quot;Microsoft YaHei&quot;;font-size:16px; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 141pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">日期类</p></td><td style="margin: 0px; padding: 0px; width: 282pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">日期格式</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 141pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">java.util.Date</p></td><td style="margin: 0px; padding: 0px; width: 282pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">年月日时分秒</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 141pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">java.sql.Date</p></td><td style="margin: 0px; padding: 0px; width: 282pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">年月日（只存储日期数据不存储时间数据）</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 141pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">java.sql.Time</p></td><td style="margin: 0px; padding: 0px; width: 282pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">时分秒</p></td></tr><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 141pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">java.sql.Timestamp</p></td><td style="margin: 0px; padding: 0px; width: 282pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">年月日时分秒纳秒（毫微秒）</p></td></tr></tbody></table></div> </td>
        </tr>
        <tr>
          <td class="col0">3.2.7 创建主模块类</td>
          <td class="col1"><ul id="l9" style="margin: 0px; padding: 0px 0px 0px 0pt; font-family: microsoft yahei; font-size:16px"><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; text-align: left;"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">作为项目启动时的入口，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Nutz&nbsp;</span>项目的主模块类类似于&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Java&nbsp;</span>应用程序的主函数&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">main</span>，是程 序的入口函数。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">任何一个类都可以作为主模块，只要在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">web.xml&nbsp;</span>内正确配置即可。通常将主模块类命名为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">MainModule</span>，见名知义。在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">cn.lrw.newsnutz&nbsp;</span>包中创建名称（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Name</span>）为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">MainModule&nbsp;</span>的主模块 类（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Class</span>），如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-12&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 94pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_027.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 21pt; text-indent: 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-12&nbsp;</span>创建主模块类&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">MainModule</span></p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 26pt; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">MainModule&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">类生成后，在类的前面添加注解，如图&nbsp;</span>3-13&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">所示。</span></p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 39pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_028.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 42pt; text-indent: 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-13&nbsp;</span>主模块类&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">MainModule&nbsp;</span>及注解</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 26pt; text-indent: 0px; font-family: 宋体; font-size: 18px;"></p><p><span style="font-family:宋体;">当前项目主模块</span>MainModule<span style="font-family:宋体;">类前面使用的注解：</span></p><p>(1)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#646464;">@SetupBy</span>(value=MainSetup.<strong><span style="color:#7F0055;">class</span></strong>)<span style="font-family:宋体;">，需要新建一个类，类名可以是</span>MainSetup<span style="font-family:宋体;">，实现</span>Setup<span style="font-family:宋体;">接口，在</span>MainSetup<span style="font-family:宋体;">类中，实现整个项目系统启动或者关闭时的一些额外处理工作，如初始化数据库、关闭</span>mysql<span style="font-family:宋体;">线程等。</span></p><p>(2)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#646464;">@Modules</span>(scanPackage=<strong><span style="color:#7F0055;">true</span></strong>)<span style="font-family:宋体;">，将自动搜索主模块所在的包（包括子包）下所有的类。</span></p><p>(3)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span style="color:#646464;">@IocBy</span>(type=ComboIocProvider.<strong><span style="color:#7F0055;">class</span></strong>, args={<span style="color:#2A00FF;">&quot;*js&quot;</span>, <span style="color:#2A00FF;">&quot;ioc/&quot;</span>,<span style="color:#2A00FF;">&quot;*anno&quot;</span>, <span style="color:#2A00FF;">&quot;cn.lrw.newsnutz&quot;</span>, <span style="color:#2A00FF;">&quot;*tx&quot; </span>})<span style="font-family:宋体;">，设置应用所采用的</span> Ioc <span style="font-family:宋体;">容器。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>ComboIocProvider<span style="font-family:宋体;">的</span>args<span style="font-family:宋体;">参数</span>, <span style="font-family:宋体;">星号开头的是类名或内置缩写</span>,<span style="font-family:宋体;">剩余的是各加载器的参数</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>*js <span style="font-family:宋体;">是</span>JsonIocLoader,<span style="font-family:宋体;">负责加载</span>js/json<span style="font-family:宋体;">结尾的</span>ioc<span style="font-family:宋体;">配置文件</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>*anno <span style="font-family:宋体;">是</span>AnnotationIocLoader,<span style="font-family:宋体;">负责处理注解式</span>Ioc, <span style="font-family:宋体;">例如</span>@IocBean</p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>*tx <span style="font-family:宋体;">是</span>TransIocLoader,<span style="font-family:宋体;">负责加载内置的事务拦截器定义</span></p><p>(4)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span><span style="font-size:10.0pt;font-family:'Times New Roman','serif';color:#646464;">@Views</span><span style="font-size:10pt;font-family:'Times New Roman', serif;">({BeetlViewMaker.</span><strong><span style="font-size:10.0pt;font-family:'Times New Roman','serif';color:#7F0055;">class</span></strong><span style="font-size:10pt;font-family:'Times New Roman', serif;">})</span><span style="font-size:10.0pt;">，指定采用Beetl模板渲染视图。</span><span style="font-size:10.0pt;font-family:宋体;">能够用在主模块上的注解，如表</span><span style="font-size:10.0pt;font-family:'Times New Roman','serif';">3-6</span><span style="font-size:10.0pt;font-family:宋体;">所示。</span></p></li><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; text-align: left;"><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 26pt; text-indent: 0px; font-family: 宋体; font-size: 18px;"><br /></p></li><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; text-align: left;"><p class="s14" style="margin: 0pt; padding: 8pt 0px 0px 5pt; text-indent: 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-6&nbsp;</span>主模块上支持的注解</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><div style="margin:0 auto;width: 900px;"><table cellspacing="0" style="margin: 0px 0px 0px 5.294pt; padding: 0px; text-indent: 0px; vertical-align: top; overflow: visible; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px 25pt; font-family: 黑体, monospace; font-size: 9pt;">注 解</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">说 明</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Modules</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用有哪些子模块，子模块不能再嵌套子模块</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@IocBy</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用应采用何种方式进行反转注入。如果没有声明，整个应用将不支持&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: times new roman serif; font-size: 9pt">Ioc</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Localization</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用的本地化字符串的目录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@SetupBy</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">应用启动和关闭时，应该进行的处理</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Views</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">扩展整个应用支持的视图模板类型</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Ok</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用默认的成功视图</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Fail</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用默认的失败视图</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@AdaptBy</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用默认的&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: times new roman serif; font-size: 9pt">HTTP&nbsp;</span>参数适配方式</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Filters</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用默认的过滤器数组</p></td></tr><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 77pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 3pt; font-family: times new roman serif; font-size: 9pt">@Encoding</p></td><td style="margin: 0px; padding: 0px; width: 346pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 2pt; font-family: 宋体; font-size: 9pt;">整个应用默认的输入输出字符编码</p></td></tr></tbody></table></div></li></ul>  </td>
        </tr>

        <tr>
          <td class="col0">3.2.8 实现Setup接口</td>
          <td class="col1"><ul id="l9" style="margin: 0px; padding: 0px 0px 0px 0pt; font-family: microsoft yahei; font-size:16px"><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; text-align: left;"><ol id="l16" style="margin: 0px; padding: 0px 0px 0px 0pt; text-indent: 0px; counter-reset: h1 3;"><ol id="l17" style="margin: 0px; padding: 0px 0px 0px 0pt; counter-reset: h2 2;"><ol id="l18" style="margin: 0px; padding: 0px 0px 0px 0pt; counter-reset: h3 7;"><li style="margin: 0px; padding: 1pt 0px 0px 60pt; text-indent: -33pt; display: block; text-align: left;"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 15.82px;">在整个应用启动或者关闭时，通常可以让系统做一些额外的处理工作，如读取配置文件、 初始化数据库等。在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">cn.lrw.newsnutz&nbsp;</span>包中新建&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">MainSetup&nbsp;</span>类，实现&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Setup&nbsp;</span>接口，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-14&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_029.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p style="margin: 0pt; padding: 3pt 0px 0px 221pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" text-align:="" center=""><span style="font-family: 宋体; font-size: 9pt;">图&nbsp;</span><span class="p" style="font-size: 9pt; margin: 0pt; padding: 0px;">3-14&nbsp;</span><span style="font-family: 宋体; font-size: 9pt;">创建&nbsp;</span><span class="p" style="font-size: 9pt; margin: 0pt; padding: 0px;">MainSetup&nbsp;</span><span style="font-family: 宋体; font-size: 9pt;">类</span><br /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>MainSetup<span style="font-family:宋体;">类中初始化数据库，如果</span>user<span style="font-family:宋体;">表没有用户数据，则添加一条默认的用户信息：</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">用户名</span>2953<span style="font-family:宋体;">，实际为登录用户名</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">姓名</span>lrw</span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">密码</span>123<span style="font-family:宋体;">，后期再运用</span>shiro<span style="font-family:宋体;">进行加密处理，提升安全性能。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#444444;">public</span></strong><span style="color:#444444;"> <strong>class</strong> </span><strong><span style="color:#880000;">MainSetup</span></strong><span style="color:#444444;"><strong>implements</strong> </span><strong><span style="color:#880000;">Setup</span></strong><span style="color:#444444;"> {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;"> @Override </span></span></p><p><span style="font-size:18px;"><span style="color:#444444;"> <strong>public void</strong> </span><strong><span style="color:#880000;">init</span></strong><span style="color:#444444;">(NutConfigarg0) {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ioc ioc = arg0.getIoc();</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Dao dao = ioc.get(Dao.class);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Daos.createTablesInPackage(dao, </span><span style="color:#880000;">&quot;cn.lrw.newsnutz.pojo&quot;</span><span style="color:#444444;">, <strong>false</strong>);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span style="color:#888888;">// </span><span style="font-family:宋体;color:#888888;">初始化默认根用户</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong> (dao.count(User.class) == </span><span style="color:#880000;">0</span><span style="color:#444444;">){</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; User user = <strong>new</strong> User();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; user.setUid(</span><span style="color:#880000;">&quot;2953&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; user.setXm(</span><span style="color:#880000;">&quot;lrw&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; user.setPwd(</span><span style="color:#880000;">&quot;123&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; user.setRole(</span><span style="color:#880000;">&quot;1&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; dao.insert(user);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">} </span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">@Override</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;"> <strong>public void</strong> </span><strong><span style="color:#880000;">destroy</span></strong><span style="color:#444444;">(NutConfigarg0) {</span><span style="color:#888888;">// webapp</span><span style="font-family:宋体;color:#888888;">销毁之前执行的逻辑</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;"> } </span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">}</span></span></p><span style="font-size:18px;"><br style="margin: 0px; padding: 0px;" /></span><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 2pt; text-indent: 0px; font-family: 宋体; font-size: 18px;"><br /></p></li></ol></ol></ol></li></ul>  </td>
        </tr>
        <tr>
          <td class="col0">3.2.9 配置web.xml</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;"></p><p><span style="font-family:宋体;">打开</span>web.xml<span style="font-family:宋体;">文件，在</span>display-name<span style="font-family:宋体;">节点和</span>welcome-file-list<span style="font-family:宋体;">节点之间，添加</span>nutz<span style="font-family:宋体;">的</span>filter<span style="font-family:宋体;">，根据实际情况正确设置</span>NutFilter<span style="font-family:宋体;">的</span>modules<span style="font-family:宋体;">参数值为主模块的包</span><strong><span style="color:red;">cn.lrw.newsnutz.MainModule</span></strong></p><p><img th:src="@{/assets/javaeeimg/591f8ecd525040c69911a5d5eaa19233.png}" align="middle" alt="" /><br /></p><p><br /></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.2.10 简单的系统首页</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">WebRoot&nbsp;</span>目录单击右键，选择新建&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTML</span>，创建一个名为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">index.html&nbsp;</span>的首页，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-15</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; font-family: 宋体; font-size: 18px;">所示。页面内容自定，可以默认，如果原来有&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">index.jsp</span>，可以删除。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 90pt; font-family: Times New Roman, serif; font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_030.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 5pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">3-15&nbsp;</span>新建首页&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">index.html</span></p> </td>
        </tr>
        <tr>
          <td class="col0">3.2.11 运行项目</td>
          <td class="col1"><ul id="l9" style="margin: 0px; padding: 0px 0px 0px 0pt; font-family: microsoft yahei; font-size:16px"><li style="margin: 0px; padding: 1pt 0px 0px 47pt; text-indent: -21pt; display: block; text-align: left;"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">运行基于&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Nutz&nbsp;</span>框架的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">JavaEE&nbsp;</span>项目。如果控制台&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">console&nbsp;</span>没有报错信息（出现&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Exception&nbsp;</span>字样），则在浏览器可以看到正常的首页信息，数据库中可以看到写入的用户信息，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-16&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 91pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_031.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 47pt; text-indent: 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-16&nbsp;</span>初始化数据库结果</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 26pt; text-indent: 0px; font-family: 宋体; font-size: 18px;">首次运行，右键单击项目名称&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">newsnutz</span>，选择&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Run As&nbsp;</span>中的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Myeclipse Server Application</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 0px; font-family: 宋体; font-size: 18px;">命令，运行完成的项目，可以看到项目的运行状态，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-17&nbsp;</span>和图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-18&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 31pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_032.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 5pt 0px 0px 5pt; text-indent: 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-17 Myeclipse Server&nbsp;</span>运行状态</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 62pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_033.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; text-indent: 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-18&nbsp;</span>控制台&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">console&nbsp;</span>信息</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 15.26px;">在浏览器中输入&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">http://localhost:8080/newsnutz&nbsp;</span>回车，如果能在浏览器中看到自己设定的首 页，则说明系统运行正常，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-19&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 125pt; text-indent: 0px; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_034.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 21pt; text-indent: 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-19&nbsp;</span>简单的默认首页</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">项目运行中，应<span style="text-indent: 21pt;">学会查看</span><span style="text-indent: 21pt;">console</span><span style="text-indent: 21pt;">中的信息，看是否存在报错信息，排除存在的问题，比如：</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>MainModule<span style="font-family:宋体;">参数出错</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">数据库配置信息有误</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>jar<span style="font-family:宋体;">包没有添加到正确的目录中</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>web.xml<span style="font-family:宋体;">中参数不正确</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>server.xml<span style="font-family:宋体;">配置错误</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>MainSetup<span style="font-family:宋体;">中提前使用了加密方法</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">启动</span>Tomcat<span style="font-family:宋体;">时，提示</span><span style="color:#0070C0;">Can’t loadAMD 64-bit .dll on a IA 32-bit platform</span><span style="font-family:宋体;">，表示目前使用</span>64<span style="font-family:宋体;">位</span>Tomcat<span style="font-family:宋体;">，</span>32<span style="font-family:宋体;">位</span>JDK<span style="font-family:宋体;">，重新安装</span>64<span style="font-family:宋体;">位</span>JDK<span style="font-family:宋体;">即可。</span></p></li></ul>  </td>
        </tr>
        <tr>
          <td class="col0">3.3 考核任务</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">掌握如何正确实现基于&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz&nbsp;</span>框架的入门项目的配置和开发过程。检查点如下：</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）可以在浏览器看到默认首页&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">index.html&nbsp;</span>的内容，无乱码。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">40&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">MyEclipse&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Console&nbsp;</span>中没有报错（如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">Exception</span>）信息。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">30&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）数据库中有系统运行后写入的用户信息。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">30&nbsp;</span>分）</p> </td>
        </tr>
        <tr>
          <td class="col0">3.4 系统日志</td>
          <td class="col1"><div style="text-indent: 28px;"><span style="font-family:宋体;"><span style="font-size: 18px;"></span></span><p><span style="font-family:宋体;">系统日志是应用软件中不可缺少的部分，通过日志，可以分析判断项目运行过程中在什么位置，出现了什么问题。</span></p><p>Apache<span style="font-family:宋体;">的开源项目</span><strong>Log4j</strong><span style="font-family:宋体;">是一个功能强大的日志组件，通过使用</span>Log4j<span style="font-family:宋体;">，可以控制日志信息输出到控制台</span>console<span style="font-family:宋体;">、文件、</span>GUI<span style="font-family:宋体;">组件，甚至是套接口服务器、</span>NT<span style="font-family:宋体;">的事件记录器等；也可以控制每一条日志的输出格式；通过定义每一条日志信息的级别，能够更加细致地控制日志的生成过程。通过一个配置文件就可以灵活地进行配置，而不需要修改应用的代码。</span></p><p><span style="font-family:宋体;">使用</span>log4j<span style="font-family:宋体;">实现系统日志的方法非常简单。</span></p><p>(1)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">添加</span>log4j-xxx.jar<span style="font-family:宋体;">到</span>lib<span style="font-family:宋体;">下，已经在</span>3.2.2<span style="font-family:宋体;">节完成。</span></p><p>(2)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">在</span>conf<span style="font-family:宋体;">目录中新建日志配置文件</span>log4j.properties<span style="font-family:宋体;">，内容可以参照网上的详细配置，也可以采用下面的简单配置：</span></p><p><span style="color:#990055;">log4j.rootLogger</span><span style="color:#444444;background:#F0F0F0;">=</span><span style="color:#0077AA;">debug,Console</span></p><p><span style="color:#990055;">log4j.appender.Console</span><span style="color:#444444;background:#F0F0F0;">=</span><span style="color:#0077AA;">org.apache.log4j.ConsoleAppender</span></p><p><span style="color:#990055;">log4j.appender.Console.layout</span><span style="color:#444444;background:#F0F0F0;">=</span><span style="color:#0077AA;">org.apache.log4j.PatternLayout</span></p><p><span style="color:#990055;">log4j.appender.Console.layout.ConversionPattern</span><span style="color:#444444;background:#F0F0F0;">=</span><span style="color:#0077AA;">%d %l %-5p -%m%n</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>log4j.rootLogger<span style="font-family:宋体;">配置根</span>Logger</p><p><span style="font-family:宋体;">包括选择日志输出级别（有</span>5<span style="font-family:宋体;">个级别可供选择：</span>FATAL<span style="font-family:宋体;">、</span>ERROR<span style="font-family:宋体;">、</span>WARN<span style="font-family:宋体;">、</span>INFO<span style="font-family:宋体;">、</span>DEBUG<span style="font-family:宋体;">），设置输出目的地命名。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>log4j.appender.appenderName<span style="font-family:宋体;">配置日志信息输出目的地</span>Appender</p><p>Appender <span style="font-family:宋体;">为日志输出目的地，</span>Log4j<span style="font-family:宋体;">提供的</span>appender<span style="font-family:宋体;">有以下几种：</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.ConsoleAppender<span style="font-family:宋体;">（控制台）</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.FileAppender<span style="font-family:宋体;">（文件）</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.DailyRollingFileAppender<span style="font-family:宋体;">（每天产生一个日志文件）</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.RollingFileAppender<span style="font-family:宋体;">（文件大小到达指定尺寸时产生一个新的文件）</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.WriterAppender<span style="font-family:宋体;">（将日志信息以流格式发送到任意指定的地方）</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>Layout<span style="font-family:宋体;">配置日志输出格式</span></p><p>Log4j<span style="font-family:宋体;">提供的</span>layout<span style="font-family:宋体;">有以下几种：</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.HTMLLayout<span style="font-family:宋体;">（以</span>HTML<span style="font-family:宋体;">表格形式布局），</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.PatternLayout<span style="font-family:宋体;">（可以灵活地指定布局模式），</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.SimpleLayout<span style="font-family:宋体;">（包含日志信息的级别和信息字符串），</span></p><p><span style="font-family:Wingdings;">n<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>org.apache.log4j.TTCCLayout<span style="font-family:宋体;">（包含日志产生的时间、线程、类别等等信息）</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>ConversionPattern<span style="font-family:宋体;">配置打印参数</span></p><p>Log4J<span style="font-family:宋体;">采用类似</span>C<span style="font-family:宋体;">语言中的</span>printf<span style="font-family:宋体;">函数的打印格式格式化日志信息，如表</span>3-7<span style="font-family:宋体;">所示。</span></p><p><span style="font-family:黑体;">表</span>3-7 log4j<span style="font-family:黑体;">日志输出打印格式</span></p><table border="1" cellspacing="0" cellpadding="0" width="520"> <tbody><tr><td style="width:40.85pt;"><p><span style="font-family:黑体;">格式</span></p></td><td style="width:348.95pt;"><p><span style="font-family:黑体;">说</span>&nbsp; <span style="font-family:黑体;">明</span></p></td></tr><tr><td style="width:40.85pt;"><p>%m</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出代码中指定的消息</span></p></td></tr><tr><td style="width:40.85pt;"><p>%p</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出优先级，即</span>DEBUG<span style="font-family:宋体;">，</span>INFO<span style="font-family:宋体;">，</span>WARN<span style="font-family:宋体;">，</span>ERROR<span style="font-family:宋体;">，</span>FATAL</p></td></tr><tr><td style="width:40.85pt;"><p>%r</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出自应用启动到输出该</span>log<span style="font-family:宋体;">信息耗费的毫秒数</span></p></td></tr><tr><td style="width:40.85pt;"><p>%c</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出所属的类目，通常就是所在类的全名</span></p></td></tr><tr><td style="width:40.85pt;"><p>%t</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出产生该日志事件的线程名</span></p></td></tr><tr><td style="width:40.85pt;"><p>%n</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出一个回车换行符，</span>Windows<span style="font-family:宋体;">平台为“</span>/r/n<span style="font-family:宋体;">”，</span>Unix<span style="font-family:宋体;">平台为“</span>/n<span style="font-family:宋体;">”</span></p></td></tr><tr><td style="width:40.85pt;"><p>%d</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出日志时间点的日期或时间，默认格式为</span>ISO8601<span style="font-family:宋体;">，也可以在其后指定格式，比如：</span>%d{yyy MMM dd HH:mm:ss , SSS}<span style="font-family:宋体;">，输出类似：</span>2002<span style="font-family:宋体;">年</span>10<span style="font-family:宋体;">月</span>18<span style="font-family:宋体;">日</span>22:10:28<span style="font-family:宋体;">，</span>921</p></td></tr><tr><td style="width:40.85pt;"><p>%l</p></td><td style="width:348.95pt;"><p><span style="font-family:宋体;">输出日志事件的发生位置，包括类目名、发生的线程，以及在代码中的行数。</span></p></td></tr></tbody></table><p><span style="font-family:宋体;">作为最核心的模块之一，</span>Nutz<span style="font-family:宋体;">的日志信息已经相当完善，看懂</span>Nutz<span style="font-family:宋体;">的日志，也是了解</span>Nutz<span style="font-family:宋体;">工作方式的核心途径之一。从控制台</span>Console<span style="font-family:宋体;">可以看到很多的日志信息，与</span>Nutz<span style="font-family:宋体;">相关的，基本上包括以下内容：</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>NutFilter<span style="font-family:宋体;">启动</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">资源扫描器开始初始化</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>NutFilter<span style="font-family:宋体;">输出容器信息</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">加载</span>MainModule</p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">加载</span>Ioc<span style="font-family:宋体;">配置信息</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">解析路径映射的信息</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">执行用户自定义</span>Setup<span style="font-family:宋体;">的信息</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span>NutFilter<span style="font-family:宋体;">完成的耗时信息</span></p><p>&nbsp;</p><br /></div>  </td>
        </tr>
        <tr>
          <td class="col0">3.5 用户登录</td>
          <td class="col1"><span style="font-size:18px;"><span style="font-family: 宋体; text-indent: 28px;">大部分&nbsp;</span><span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 14px="">Web&nbsp;</span><span style="font-family: 宋体; text-indent: 28px;">系统都具有用户登录模块，因为只有登录用户才能拥有某些特定操作的权限。 要实现登录功能，必定有登录页面，当前项目的系统首页与登录页面集成在一个页面上，所以 修改了默认的&nbsp;</span><span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 14px="">index.html</span><span style="font-family: 宋体; text-indent: 28px;">。</span></span><br />  </td>
        </tr>
        <tr>
          <td class="col0">3.5.1 美化系统首页</td>
          <td class="col1"><div style="text-align: justify; text-indent: 28px;"><span style="font-family:宋体;"><span style="font-size: 18px;"></span></span><p><span style="font-family:宋体;">换一个漂亮的系统首页</span>index.html<span style="font-family:宋体;">，如果前端开发能力比较强，建议原创开发一个有个性特色的首页。为了节省时间，可以从其它网站获取免费开源的一些页面，例如从</span><span style="font-family:宋体;">模板之家</span><span style="font-family:宋体;">下载，然后可以进行一些修改和内容调整，例如：</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">分离出需要的样式内容，新建</span>login.css<span style="font-family:宋体;">，存放于</span>WebRoot\include\css</p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">分离出需要的</span>javascript<span style="font-family:宋体;">内容，新建</span>login.js<span style="font-family:宋体;">，存放于</span>WebRoot\include\js</p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">整合其它需要的</span>js<span style="font-family:宋体;">和</span>css<span style="font-family:宋体;">等文件，放进项目中</span>include<span style="font-family:宋体;">的相应文件夹。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">在</span>index.html<span style="font-family:宋体;">文件中，引入需要的</span>js<span style="font-family:宋体;">和</span>css<span style="font-family:宋体;">等文件，当前页面使用了</span>EasyUI<span style="font-family:宋体;">框架，所以也引用了</span>easyui<span style="font-family:宋体;">的</span>js<span style="font-family:宋体;">和</span>css<span style="font-family:宋体;">等文件。</span></p><p><span style="font-size:14pt;font-family:Consolas;">&nbsp; </span><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">meta</span> <span style="color:#7F007F;">http-equiv</span>=<em><span style="color:#2A00FF;">&quot;Content-Type&quot;</span></em><span style="color:#7F007F;">content</span>=<em><span style="color:#2A00FF;">&quot;text/html; charset=utf-8&quot;</span></em> <span style="color:teal;">/&gt;</span></p><p>&nbsp;&nbsp;<span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/css&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;./include/css/main.css&quot;</span></em><span style="color:teal;">/&gt;</span></p><p>&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/css&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/themes/default/easyui.css&quot;</span></em><span style="color:teal;">/&gt;</span></p><p>&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/css&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/themes/icon.css&quot;</span></em><span style="color:teal;">/&gt;</span></p><p>&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;./include/js/jquery.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></p><p>&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/jquery.easyui.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></p><p>&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/locale/easyui-lang-zh_CN.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></p><p>&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;./include/js/login.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">删除不需要的代码，比如</span>action<span style="font-family:宋体;">，</span>method<span style="font-family:宋体;">，</span>type=&quot;submit&quot;…<span style="font-family:宋体;">。</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">修改部分代码，例如修改用户名和密码</span>input<span style="font-family:宋体;">的</span>id<span style="font-family:宋体;">和</span>name<span style="font-family:宋体;">值，使其与</span>User<span style="font-family:宋体;">类中的属性一致，以便封装数据传输到后端。</span></p><p><span style="font-family:宋体;">首页核心</span>html<span style="font-family:宋体;">代码如下，主要实现用户在</span>web<span style="font-family:宋体;">系统的前端页面输入用户名和密码，然后点击“登录”按钮。软件开发技术的学习，主要是学会方法，要活学活用，切忌死记硬背、生搬硬套。所以不同的人实现的前端页面可以有不同的风格、特征。</span></p><p><span style="color:#444444;">&lt;form </span><span style="color:#397300;">id</span><span style="color:#444444;">=</span><span style="color:#880000;">&quot;login_form&quot;</span><span style="color:#444444;"> <strong>onsubmit=</strong></span><strong><span style="color:#880000;">&quot;returnfalse;&quot;</span></strong><span style="color:#444444;">&gt;</span></p><p><span style="color:#444444;">&lt;input type=</span><span style="color:#880000;">&quot;text&quot;</span><span style="color:#397300;">id</span><span style="color:#444444;">=</span><span style="color:#880000;">&quot;uid&quot;</span><span style="color:#444444;"> placeholder=</span><span style="color:#880000;">&quot;</span><span style="font-family:宋体;color:#880000;">用户名</span><span style="color:#880000;">...&quot;</span><span style="color:#444444;">&gt;</span></p><p><span style="color:#444444;">&lt;input type=</span><span style="color:#880000;">&quot;password&quot;</span><span style="color:#397300;">id</span><span style="color:#444444;">=</span><span style="color:#880000;">&quot;pwd&quot;</span><span style="color:#444444;"> placeholder=</span><span style="color:#880000;">&quot;</span><span style="font-family:宋体;color:#880000;">密码</span><span style="color:#880000;">...&quot;</span><span style="color:#444444;"> &gt;</span></p><p><span style="color:#444444;">&lt;/form&gt;</span></p><p><span style="color:#444444;">&lt;input </span><span style="color:#397300;">id</span><span style="color:#444444;">=</span><span style="color:#880000;">&quot;login_submit&quot;</span><span style="color:#444444;"> value=</span><span style="color:#880000;">&quot;</span><span style="font-family:宋体;color:#880000;">登录</span><span style="color:#880000;">&quot;</span><span style="color:#444444;"> &gt;</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><span style="font-family:宋体;">将会在</span>login.js<span style="font-family:宋体;">中添加代码，实现表单信息的获取、检验、通过</span>ajax<span style="font-family:宋体;">向后端传输；处理后端返回的消息。以下</span>JS<span style="font-family:宋体;">代码，让首页上的热气球随机移动，呈现动态效果。如果看不懂，暂时不要去管它；这种效果你也可以不使用。</span></p><p>$(<strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp; airBalloon(<span style="color:#2A00FF;">'div.air-balloon'</span>);</p><p>});</p><p><strong><span style="color:#7F0055;">function</span></strong> airBalloon(balloon){</p><p>&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>viewSize = [] , viewWidth = 0 , viewHeight = 0 ;</p><p>&nbsp;&nbsp;&nbsp;&nbsp; resize();&nbsp;&nbsp;&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp; $(balloon).each(<strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<strong><span style="color:#7F0055;">this</span></strong>).css({top:rand(40, viewHeight * 0.5 ) , left : rand( 10 , viewWidth - $(<strong><span style="color:#7F0055;">this</span></strong>).width() ) });</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fly(<strong><span style="color:#7F0055;">this</span></strong>);</p><p>&nbsp;&nbsp;&nbsp;&nbsp; });&nbsp;&nbsp;&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp; $(window).resize(<strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; resize()</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(balloon).each(<strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<strong><span style="color:#7F0055;">this</span></strong>).stop().animate({top: rand(40, viewHeight * 0.5 ) , left :rand( 10 , viewWidth - $(<strong><span style="color:#7F0055;">this</span></strong>).width() ) } ,1000 , <strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fly(<strong><span style="color:#7F0055;">this</span></strong>);</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; });</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; });</p><p>&nbsp;&nbsp;&nbsp;&nbsp; });</p><p>&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">function</span></strong>resize(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; viewSize = getViewSize();</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; viewWidth = $(document).width() ;</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; viewHeight = viewSize[1] ;</p><p>&nbsp;&nbsp;&nbsp;&nbsp; }</p><p>&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">function</span></strong>fly(obj){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong> $obj= $(obj);</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>currentTop = parseInt($obj.css(<span style="color:#2A00FF;">'top'</span>));</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>currentLeft = parseInt($obj.css(<span style="color:#2A00FF;">'left'</span>) );</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>targetLeft = rand( 10 , viewWidth - $obj.width() );</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>targetTop = rand(40, viewHeight /2 );</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>removing = Math.sqrt( Math.pow( targetLeft - currentLeft , 2 )&nbsp; + Math.pow( targetTop - currentTop , 2 ) );&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>moveTime = removing / 24;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $obj.animate({ top : targetTop ,left : targetLeft} , moveTime * 1000 , <strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; setTimeout(<strong><span style="color:#7F0055;">function</span></strong>(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fly(obj);</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, rand(1000, 3000) );</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; });&nbsp;&nbsp;&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp; }</p><p>&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">function</span></strong>rand(mi,ma){&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong> range= ma - mi;</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong> out =mi + Math.round( Math.random() * range) ;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong>parseInt(out);</p><p>&nbsp;&nbsp;&nbsp;&nbsp; }</p><p>&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">function</span></strong>getViewSize(){</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>de=document.documentElement;</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>db=document.body;</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>viewW=de.clientWidth==0 ?&nbsp; db.clientWidth: de.clientWidth;</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>viewH=de.clientHeight==0 ?&nbsp;db.clientHeight : de.clientHeight;</p><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong>Array(viewW,viewH);</p><p>&nbsp;&nbsp;&nbsp;&nbsp; }</p><p>};</p><br /></div>  </td>
        </tr>
        <tr>
          <td class="col0">3.5.2 Ajax方法</td>
          <td class="col1"><p><span style="font-size:18px;">Ajax<span style="font-family:宋体;">是异步</span> JavaScript <span style="font-family:宋体;">和</span> XML<span style="font-family:宋体;">；是一种用于创建快速动态网页的技术；</span> Ajax<span style="font-family:宋体;">通过前端页面与后端服务器进行少量数据交换，使网页实现异步更新，可以在不重新加载整个网页的情况下，对网页的某部分进行更新。</span>Ajax<span style="font-family:宋体;">可使</span>Internet<span style="font-family:宋体;">应用程序更小、更快、更友好。</span></span></p><p><span style="font-size:18px;">$.ajax([settings]) <span style="font-family:宋体;">方法通过</span> HTTP <span style="font-family:宋体;">请求加载远程数据，是</span>jQuery <span style="font-family:宋体;">底层</span> AJAX <span style="font-family:宋体;">实现。常用参数配置</span>settings<span style="font-family:宋体;">：</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="color:#0479A7;">url </span></strong><span style="font-family:宋体;">发送请求的地址。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="color:#0479A7;">type </span></strong><span style="font-family:宋体;">请求方式</span> (&quot;POST&quot; <span style="font-family:宋体;">或</span> &quot;GET&quot;)</span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="color:#0479A7;">data </span></strong><span style="font-family:宋体;">发送到服务器的数据，必须为</span> Key/Value <span style="font-family:宋体;">格式。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="color:#0479A7;">error </span></strong><span style="font-family:宋体;">请求失败后的回调函数。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="color:#0479A7;">success </span></strong><span style="font-family:宋体;">请求成功后的回调函数。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">采用</span>jquery+ajax<span style="font-family:宋体;">，可以非常灵活地校验、封装和提交表单信息。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>login.js<span style="font-family:宋体;">文件中，添加一个</span>checkUserName<span style="font-family:宋体;">函数，用于校验和提交登录信息，代码如下。</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">Var base=</span><span style="color:#880000;">&quot;./&quot;;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">$(<strong>function</strong>() {</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; $(</span><span style="color:#880000;">'#login_form input'</span><span style="color:#444444;">).keydown(<strong>function</strong> (e) {</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(e.keyCode == </span><span style="color:#880000;">13</span><span style="color:#444444;">)</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; checkUserName();</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">});</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; $(</span><span style="color:#880000;">&quot;#login_submit&quot;</span><span style="color:#444444;">).click(checkUserName);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">});</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#444444;">function</span><span style="color:#880000;">checkUserName</span></strong><span style="color:#444444;">()//</span><span style="font-family:宋体;color:#444444;">登录前，校验用户信息</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">{&nbsp;&nbsp; </span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>var</strong>a=$(</span><span style="color:#880000;">'#uid'</span><span style="color:#444444;">).val();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>var</strong>b=$(</span><span style="color:#880000;">'#pwd'</span><span style="color:#444444;">).val();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(a==</span><span style="color:#880000;">&quot;&quot;</span><span style="color:#444444;">){alert(</span><span style="color:#880000;">&quot;</span><span style="font-family:宋体;color:#880000;">请输入用户名</span><span style="color:#880000;">&quot;</span><span style="color:#444444;">);<strong>return</strong>;}</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(b==</span><span style="color:#880000;">&quot;&quot;</span><span style="color:#444444;">){alert(</span><span style="color:#880000;">&quot;</span><span style="font-family:宋体;color:#880000;">请输入登录密码</span><span style="color:#880000;">&quot;</span><span style="color:#444444;">);<strong>return</strong>;}</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url: base+</span><span style="color:#880000;">&quot;user/doLogin&quot;</span><span style="color:#444444;">,</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data:{</span><span style="color:#880000;">&quot;uid&quot;</span><span style="color:#444444;">:a,</span><span style="color:#880000;">&quot;pwd&quot;</span><span style="color:#444444;">:b},</span><span style="color:#888888;">//</span><span style="font-family:宋体;color:#888888;">只封装和传输指定的数据</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type:</span><span style="color:#880000;">&quot;POST&quot;</span><span style="color:#444444;">,</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success: <strong>function</strong> (res) {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(res.ok) {</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span style="color:#397300;">window</span><span style="color:#444444;">.location.href=base+res.msg;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<strong>else</strong>{alert(res.msg);}</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>return</strong></span><span style="color:#78A960;">false</span><span style="color:#444444;">;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error: <strong>function</strong>(res) {alert(</span><span style="color:#880000;">&quot;</span><span style="font-family:宋体;color:#880000;">系统错误！</span><span style="color:#880000;">&quot;</span><span style="color:#444444;">);}</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">如果在登录窗口的输入框中，按下回车键或直接点击登录按钮，则执行函数</span>checkUserName<span style="font-family:宋体;">；在</span>checkUserName<span style="font-family:宋体;">函数中，首先获取用户输入的用户名和密码，然后校验，如果有一个没有输入，则弹出警告框，不再向后端发送登录请求；否则，</span><span style="font-family:宋体;">采用</span>JSON<span style="font-family:宋体;">形式只封装用户名和密码，向后端发送</span>post<span style="font-family:宋体;">登录请求；后端将处理结果返回，函数中继续判断返回的信息，如果有问题，则弹出提示框，否则跳转到后台管理页面。</span></span></p></td>
        </tr>
        <tr>
          <td class="col0">3.5.3 更友好的alert</td>
          <td class="col1"><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="" line-height:="" 28px="">Js&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">中的&nbsp;</span>alert&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">中框用于显示一些给用户的提示信息，如图&nbsp;</span>3-20&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">所示，使用了语句：</span>alert(&quot;&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">请输入用户名</span>&quot;);<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">。</span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 97pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_035.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-20 alert&nbsp;</span>提示框</p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="" line-height:="" 28px="">EasyUI&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">中的&nbsp;</span>alert&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">提示框显示一个提示窗口，比&nbsp;</span>Js&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">中的&nbsp;</span>alert&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">提示框更加漂亮，并且可以 定制输出，形式更灵活，如图&nbsp;</span>3-21&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">所示。</span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 139pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_036.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI alert&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">的应用方法：</span></p><p class="s9" style="margin: 0pt; padding: 5pt 0px 0px; font-family: 宋体; font-size: 9pt;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-21 EasyUI&nbsp;</span>中的&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">alert&nbsp;</span>提示窗口</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">1</span>）引用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>库。在首页中链接&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>的样式文件和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Js&nbsp;</span>库文件，通常把第三方官方 的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Js&nbsp;</span>和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Css&nbsp;</span>库集中存放在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">include&nbsp;</span>目录下面的专用文件夹，如把&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>库放在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">include&nbsp;</span>目录下。 不同&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Js&nbsp;</span>或者不同&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Css&nbsp;</span>的引用顺序有先后关系，后引用的样式会代替前面引用的相同样式，但</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 18px; line-height: 28px;">先引用的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Js&nbsp;</span>变量或函数可以用在后引用的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Js&nbsp;</span>中。例如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">jquery.min.js&nbsp;</span>的引用比较靠前，因为有 很多&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Js&nbsp;</span>会用到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">jquery&nbsp;</span>技术。引用顺序参考如下：</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 18px; line-height: 28px;"></p><p><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/themes/default/easyui.css&quot;</span></em><span style="color:teal;">&gt;</span></p><p><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/themes/icon.css&quot;</span></em><span style="color:teal;">&gt;</span></p><p><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/jquery.easyui.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></p><p><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;./include/easyui/locale/easyui-lang-zh_CN.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></p><p>1)<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">使用语法：</span></p><p><span style="color:red;">$.messager.alert(title, msg, icon, fn)</span></p><p style="margin: 0pt; padding: 2pt 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"><span class="ptimes new roman serif; font-size: 9pt" style="font-family: 宋体; font-size: 18px; margin: 0pt; padding: 0px;">&nbsp;</span><span style="font-family: 宋体; font-size: 18px; text-indent: 21pt;">参数说明：&nbsp;</span></p><p style="margin: 0pt; padding: 2pt 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"><span class="s6" times="" new="" roman="" serif="" font-size:="" 18px="" style="font-family: 宋体; font-size: 18px; margin: 0px; padding: 0px;">title</span><span style="font-family: 宋体; font-size: 18px; text-indent: 21pt;">：显示在头部面板上的标题文本。&nbsp;</span></p><p style="margin: 0pt; padding: 2pt 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"><span class="s6" times="" new="" roman="" serif="" font-size:="" 18px="" style="font-family: 宋体; font-size: 18px; margin: 0px; padding: 0px;">msg</span><span style="font-family: 宋体; font-size: 18px; text-indent: 21pt;">：要显示的消息文本。</span><br /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体;"><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;" times="" new="" roman="" serif="" font-size:="" 18px="">icon</span><span style="font-size: 18px;">：要显示的图标图片</span><span style="font-size: 18px; margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_037.png}" style="margin: 0px; padding: 0px;" alt="" /></span><span style="font-size: 18px;">。可用的值是：</span><span style="font-size:18px;"><strong><span style="font-family: Times New Roman, serif; color: red;">info</span></strong><span style="font-family: 宋体;">、</span><strong><span style="font-family: Times New Roman, serif; color: red;">question</span></strong><span style="font-family: 宋体;">、</span><strong><span style="font-family: Times New Roman, serif; color: red;">error</span></strong><span style="font-family: 宋体;">、</span><strong><span style="font-family: Times New Roman, serif; color: red;">warning</span></strong></span><span style="font-size: 18px;">。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""><span style="font-size:18px;">fn</span><span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">：当窗口关闭时触发的回调函数。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3</span>）使用语句如下：</p><p style="margin: 0pt; padding: 0px 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"><span style="font-size:18px;"><span style="font-family: Times New Roman, serif; color: red;">$.messager.alert(&quot;</span><span style="font-family: 宋体; color: red;">系统提示</span><span style="font-family: Times New Roman, serif; color: red;">&quot;,&quot;</span><span style="font-family: 宋体; color: red;">请输入用户名</span><span style="font-family: Times New Roman, serif; color: red;">&quot;,&quot;warning&quot;);</span></span><br /></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">在后面的开发中，均可以使用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">alert&nbsp;</span>提示窗口功能。</p>  </td>
        </tr>
        <tr>
          <td class="col0">3.5.4 标题图标</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">打开某一个网页会在浏览器的标签栏处显示该网页的标题和图标，当网页被添加到收藏 夹或者书签中时也会出现网页的图标。添加标题图标会让&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Web&nbsp;</span>系统显得更专业。给网页标题 前添加一个小图标，效果如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-22&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 168pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_038.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-22&nbsp;</span>网页标题与图标</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">实现方法是用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">link&nbsp;</span>标签实现&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">shortcut icon</span>，图标文件可以在线制作&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">ICO</span>，也可用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">PhotoShop&nbsp;</span>制作&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">256*256&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">png&nbsp;</span>或&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">gif&nbsp;</span>文件，前景和背景对比度明显，前景内容较少但所占空间较多，这 样的图标显示效果会比较清晰。制作的图标文件可以存放到&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">include/img&nbsp;</span>目录下，通过标签&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">link&nbsp;</span>链接。</p><p style="margin: 0pt; padding: 3pt 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"><span style="font-size:18px;"><span style="font-family: Times New Roman, serif; color: teal;">&lt;</span><span style="font-family: Times New Roman, serif; color: rgb(63, 127, 127);">link</span><span style="font-family: Times New Roman, serif;"> <span style="color: rgb(127, 0, 127);">rel</span>=<em><span style="color:#2A00FF;">&quot;shortcuticon&quot;</span></em> <span style="color: rgb(127, 0, 127);">href</span>=<em><span style="color:#2A00FF;">&quot;./include/img/logo.png&quot;</span></em><span style="color: teal;">&gt;</span></span></span><br /><br /></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.5.5 MVC概述</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">前端页面，设计完成还需要后端服务器来响应和处理前端页面发送的请求。<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Mvc&nbsp;</span>需 要与&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Web&nbsp;</span>服务器（比如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Tomcat</span>）一起工作，它存在的意义就是要把一个标准的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTTP&nbsp;</span>请求， 转发到某一个&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Java&nbsp;</span>函数中，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Mvc&nbsp;</span>的工作方式图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-23&nbsp;</span>所示。用户在浏览器打开&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Web&nbsp;</span>系统 前端页面（视图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">V</span>），通过&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Form&nbsp;</span>或&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Ajax&nbsp;</span>发送&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTTP&nbsp;</span>请求，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Web&nbsp;</span>系统通过&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">MVC&nbsp;</span>协调，由控制 器&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">C&nbsp;</span>中特定的方法（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Java&nbsp;</span>函数）来响应用户请求，控制器&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">C&nbsp;</span>根据请求，调用模型中的业务逻 辑方法，业务逻辑调用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Dao&nbsp;</span>中的方法访问数据库等持久化数据。模型处理访问的数据后，控 制器&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">C&nbsp;</span>将处理结果渲染&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">render</span>，返回&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Response&nbsp;</span>到前端页面，在前端页面显示或自动发起另一 个&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTTP&nbsp;</span>请求。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_039.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p style="margin: 0pt; padding: 3pt 0px 0px 296pt; text-indent: -13pt; font-family: Times New Roman, serif; font-size: 9pt; line-height: 17.88px;"><span style="font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;</span><span class="p" style="font-size: 9pt; text-align: center; margin: 0pt; padding: 0px;">3-23 Nutz.Mvc&nbsp;</span><span style="font-family: 宋体; font-size: 9pt; text-align: center;">工作方式</span><br /></p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 26pt; font-family: Times New Roman, serif; font-size: 18px;">MVC&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">是指模型（</span>model<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）、视图（</span>view<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）和控制器（</span>controller<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">），具体描述如下：</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Model</span>（模型）表示应用程序核心，是应用程序中用于处理数据逻辑的部分，负责 在数据库中存取数据。为了将数据访问与业务逻辑分离，提高业务精度，模型层又划分为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">DAO&nbsp;</span>层和业务层（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Service</span>）。</p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 47pt; text-indent: -21pt; font-family: Times New Roman, serif; font-size: 18px; line-height: 28px; text-align: justify;"><span class="s11" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Wingdings; font-size: 9pt;">?&nbsp;</span>DAO<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">（</span>Data Access Object<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）—主要职能是将访问数据库的代码封装起来，让这些代 码不会在其他层出现或者暴露出来给其他层。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 47pt; text-indent: -21pt; font-family: 宋体; font-size: 18px; line-height: 15.12px; text-align: justify;"><span class="s11" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Wingdings; font-size: 9pt;">?&nbsp;</span>业务层—是整个系统最核心也是最具有价值的一层。该层封装应用程序的业务逻 辑，处理用户需求的数据。在业务处理过程中会访问原始数据或产生新数据，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">DAO&nbsp;</span>层提供的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">DAO&nbsp;</span>类能很好地帮助业务层完成数据处理。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">View</span>（视图）显示数据，通常依据模型数据创建。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Controller</span>（控制器）是应用程序中处理用户交互的部分。通常负责从视图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">View&nbsp;</span>读 取用户请求，将其转发给模型&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Model</span>，经过处理后把结果返回到视图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">View</span>。</p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: Times New Roman, serif; font-size: 18px; line-height: 15.26px; text-align: justify;">MVC&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">要实现的目标是将软件用户界面&nbsp;</span>View&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">和业务逻辑分离，降低代码之间的耦合， 以使代码可扩展性、可复用性、可维护性、灵活性加强。使同一个程序可以使用不同的表 现形式。控制器&nbsp;</span>Controller&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">将用户请求转发给模型层&nbsp;</span>Model<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">，经过处理后把结果返回到视图&nbsp;</span>View&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">层。</span></p> </td>
        </tr>
        <tr>
          <td class="col0">3.5.6 MVC注解</td>
          <td class="col1"><p class="s6" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: Times New Roman, serif; font-size: 18px; line-height: 28px; text-align: justify;">Nutz.Mvc&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">根据</span>@At&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">注解将一个&nbsp;</span>HTTP&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">请求路径同一个&nbsp;</span>Java&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">函数关联起来。子模块中任何 函数，只要是&nbsp;</span>public&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">且不是&nbsp;</span>static&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">的，都可以作为入口函数。标记入口函数的方法是在其上标</span><span style="font-family: 宋体; font-size: 18px;">注注解</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">@At</span><span style="font-family: 宋体; font-size: 18px;">。使用不带参数的</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">@At()</span><span style="font-family: 宋体; font-size: 18px;">注解，默认会使用小写的方法名</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">/</span><span style="font-family: 宋体; font-size: 18px;">类名作为入口&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">URL</span><span style="font-family: 宋体; font-size: 18px;">；有 参数时，以参数作为入口&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">URL</span><span style="font-family: 宋体; font-size: 18px;">。</span></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">任何一个请求，都会经过四道工序，才能获得返回结果。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）过滤：通过&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Filters&nbsp;</span>注解可以为你的入口函数定义任意多的过滤器</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）适配：这个过程将&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTTP&nbsp;</span>输入流转换成入口函数的参数数组，默认输入流是传统的 名值对方式，例如文件上传&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">UploadAdptor</span>。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）调用：调用入口函数，函数里面需要调用相关的业务层代码。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">4</span>）渲染：根据入口函数的返回，渲染&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">HTTP Response</span>。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">除了这种标准流程，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Mvc&nbsp;</span>还支持“动作链”的方式，可以让用户几乎无限地定制一 个请求的处理流程和方式。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">如果直接返回一个&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">View</span>，则用这个&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">View&nbsp;</span>来渲染，否则用函数的<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Ok&nbsp;</span>注解声明的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">View&nbsp;</span>来 渲染入口函数的返回对象。如果你的函数处理过程中抛出了异常，用<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">@Fail&nbsp;</span>注解声明的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">View&nbsp;</span>来渲染异常对象，返回值会保存在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">request&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">attr&nbsp;</span>中，名字是&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">obj</span>。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">表&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-8&nbsp;</span>是子模块上支持的注解，表&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-9&nbsp;</span>是子模块中入口函数上支持的注解。</p><p class="s14" style="margin: 0pt; padding: 9pt 0px 0px 5pt; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-8&nbsp;</span>子模块上支持的注解</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><div style='margin:0 auto;width: 900px;'><table cellspacing="0" style="margin: 0px 0px 0px 5.89399pt; padding: 0px; vertical-align: top; overflow: visible; font-family: &quot;Microsoft YaHei&quot;;font-size:16px; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px 21pt; font-family: 黑体, monospace; font-size: 9pt;">注 解</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">说 明</p></td></tr><tr style="margin: 0px; padding: 0px; height: 41pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@IocBean</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 1pt 5pt 0px; font-family: Times New Roman, serif; font-size: 9pt;">AnnotationIocLoader<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">（注解加载器）根据它来判断哪些类应该被自己加载&nbsp;</span>AnnotationIocLoader&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">根据</span>@Inject&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">来注入类的属性（例如&nbsp;</span>Dao&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">对象），有</span>@IocBean&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">它才 会生效</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@At</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">模块所有入口函数的&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">URL&nbsp;</span>前缀</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Ok</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">模块默认成功视图</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Fail</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">模块默认失败视图</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@AdaptBy</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">模块默认&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTTP&nbsp;</span>参数适配方式</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Filters</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">模块默认的过滤器数组</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Encoding</p></td><td style="margin: 0px; padding: 0px; width: 352pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">模块默认&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTTP&nbsp;</span>请求的输入输出字符编码</p></td></tr></tbody></table></div><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s14" style="margin: 0pt; padding: 2pt 0px 0px 47pt; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-9&nbsp;</span>入口函数上支持的注解</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><div style='margin:0 auto;width: 900px;'><table cellspacing="0" style="margin: 0px 0px 0px 5.29399pt; padding: 0px; vertical-align: top; overflow: visible; font-family: &quot;Microsoft YaHei&quot;;font-size:16px; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 19pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px 21pt; font-family: 黑体, monospace; font-size: 9pt;">注 解</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">说 明</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@At</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">函数对应的&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">URL</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Ok</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">成功视图</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Fail</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">失败视图</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@AdaptBy</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">HTTP&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">参数适配方式</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Filters</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">函数的过滤器数组</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@Encoding</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: Times New Roman, serif; font-size: 9pt;">HTTP&nbsp;<span class="s18" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 9pt;">请求的输入输出字符编码</span></p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@GET</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">限定函数接受&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTTP GET&nbsp;</span>请求</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@POST</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">限定函数接受&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTTP POST&nbsp;</span>请求</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@PUT</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">限定函数接受&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTTP PUT&nbsp;</span>请求</p></td></tr><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 70pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 6pt; font-family: Times New Roman, serif; font-size: 9pt;">@DELETE</p></td><td style="margin: 0px; padding: 0px; width: 353pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 9pt;">限定函数接受&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">HTTP DELETE&nbsp;</span>请求</p></td></tr></tbody></table></div> </td>
        </tr>
        <tr>
          <td class="col0">3.5.7 DAO接口方法</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">目前流行的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Web&nbsp;</span>系统基本都需要数据库的支持，所以在系统的使用过程中，需要访问 数据库。软件开发人员需要编写公共&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">DAO&nbsp;</span>类，实现添加、删除、修改和查询数据库操作， 俗称增删改查（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">CRUD</span>，即&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Create&nbsp;</span>添加数据、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Read&nbsp;</span>读取查询数据、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Update&nbsp;</span>修改数据和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Delete&nbsp;</span>删除数据）。传统关系型数据库定义了四种数据操作：插入&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Insert</span>、删除&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Delete</span>、更新&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Update&nbsp;</span>和查询&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Query</span>，这四种操作涵盖了所有的数据操作。<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Nutz.Dao&nbsp;</span>已经封装了表&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-10&nbsp;</span>所示的数 据操作。</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p class="s14" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">表&nbsp;<span class="s15" style="margin: 0px; padding: 0px; font-family: Arial, sans-serif; font-size: 9pt;">3-10 Dao&nbsp;</span>的数据操作</p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><div style='margin:0 auto;width: 900px;'><table cellspacing="0" style="margin: 0px 0px 0px 5.294pt; padding: 0px; vertical-align: top; overflow: visible; font-family: &quot;Microsoft YaHei&quot;;font-size:16px; border-collapse: collapse;"><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">操作</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">方法名</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s16" style="margin: 0pt; padding: 1pt 0px 0px; font-family: 黑体, monospace; font-size: 9pt; text-align: center;">说 明</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">插入</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Insert</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL&nbsp;</span>插入一条记录或者多条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">插入</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">FastInsert</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL</span>，通过&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">batch&nbsp;</span>插入多条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">删除</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Delete</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL&nbsp;</span>删除一条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">更新</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Update</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL&nbsp;</span>更新一条或者多条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">获取</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Fetch</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL&nbsp;</span>获取一条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">查询</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Query</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL&nbsp;</span>根据条件获取多条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">清除</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Clear</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">一条&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">SQL&nbsp;</span>根据条件删除多条记录</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">建表</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Create</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">根据实体建表</p></td></tr><tr style="margin: 0px; padding: 0px; height: 17pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">删表</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Drop</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">根据实体<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">/</span>表名称进行删表</p></td></tr><tr style="margin: 0px; padding: 0px; height: 18pt;"><td style="margin: 0px; padding: 0px; width: 85pt; border-top-style: solid; border-top-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt; border-right-style: solid; border-right-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 6pt; font-family: 宋体; font-size: 9pt;">聚合</p></td><td style="margin: 0px; padding: 0px; width: 84pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px 4pt; font-family: Times New Roman, serif; font-size: 9pt;">Func</p></td><td style="margin: 0px; padding: 0px; width: 254pt; border-top-style: solid; border-top-width: 1pt; border-left-style: solid; border-left-width: 1pt; border-bottom-style: solid; border-bottom-width: 1pt;"><p class="s18" style="margin: 0pt; padding: 0px 0px 0px 4pt; font-family: 宋体; font-size: 9pt;">执行&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">sum</span>、<span class="s17" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">count&nbsp;</span>等操作</p></td></tr></tbody></table></div> </td>
        </tr>
        <tr>
          <td class="col0">3.5.8 登录方法</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">在已经了解&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Mvc&nbsp;</span>注解和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Dao&nbsp;</span>接口方法后，下面介绍实现控制器中的登录方法。在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">cn.lrw.newsnutz.module&nbsp;</span>包中创建子模块&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">UserAct&nbsp;</span>类，在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">UserAct&nbsp;</span>类中实现对用户信息的增删改 查。例如，用户登录&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">doLogin</span>，实际上就是查找用户信息。在类中添加&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Ioc&nbsp;</span>相关注解或属性， 如<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">@IocBean</span>，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">@Inject</span>，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">@At&nbsp;</span>和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Dao&nbsp;</span>属性。注解<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">@Param&nbsp;</span>用于获取前端&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">request&nbsp;</span>的参数值。<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">doLogin&nbsp;</span>方法接收登录页面传来的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">uid&nbsp;</span>和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">pwd&nbsp;</span>信息，将其作为查询条件，在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">user&nbsp;</span>表中查找是否有满足 条件的用户。根据查询结果，返回&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">json&nbsp;</span>格式的信息，返回信息使用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">NutMap&nbsp;</span>封装。代码如下：</p><p style="margin: 0pt; padding: 2pt 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"></p><p><span style="color:#646464;"><span style="font-size:18px;">@IocBean</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@At</span>(<span style="color:#2A00FF;">&quot;/user&quot;</span>)</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">class</span></strong> UserAct {</span></p><p> <span style="color:#646464;"><span style="font-size:18px;">@Inject</span></span></p><p> <span style="font-size:18px;"><strong><span style="color:#7F0055;">protected</span></strong>Dao <span style="color:#0000C0;">dao</span>;</span></p><p> <span style="font-size:18px;"><span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">查</span><span style="color:#3F7F5F;">--</span><span style="font-family:宋体;color:#3F7F5F;">登录</span></span></p><p> <span style="color:#646464;"><span style="font-size:18px;">@At</span></span></p><p> <span style="font-size:18px;"><span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;json&quot;</span>)</span></p><p> <span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span></strong>Object doLogin(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;uid&quot;</span>)String <span style="color:#6A3E3E;">uid</span>,<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;pwd&quot;</span>)String <span style="color:#6A3E3E;">pwd</span>, HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; NutMap <span style="color:#6A3E3E;">re</span>= <strong><span style="color:#7F0055;">new</span></strong> NutMap();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; User <span style="color:#6A3E3E;">user</span>= <span style="color:#0000C0;">dao</span>.fetch(User.<strong><span style="color:#7F0055;">class</span></strong>,<span style="color:#6A3E3E;">uid</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(<span style="color:#6A3E3E;">user</span> == <strong><span style="color:#7F0055;">null</span></strong>) {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">re</span>.put(<span style="color:#2A00FF;">&quot;ok&quot;</span>, <strong><span style="color:#7F0055;">false</span></strong>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">re</span>.put(<span style="color:#2A00FF;">&quot;msg&quot;</span>, <span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">用户名不存在</span><span style="color:#2A00FF;">&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong><span style="color:#6A3E3E;">re</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(!<span style="color:#6A3E3E;">pwd</span>.equals(<span style="color:#6A3E3E;">user</span>.getPwd())){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">re</span>.put(<span style="color:#2A00FF;">&quot;ok&quot;</span>, <strong><span style="color:#7F0055;">false</span></strong>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">re</span>.put(<span style="color:#2A00FF;">&quot;msg&quot;</span>, <span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">密码不正确</span><span style="color:#2A00FF;">&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong><span style="color:#6A3E3E;">re</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">登录成功后</span><span style="color:#3F7F5F;">...</span><span style="font-family:宋体;color:#3F7F5F;">将用户信息保存到</span><span style="color:#3F7F5F;">session</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">session</span>.setAttribute(<span style="color:#2A00FF;">&quot;me&quot;</span>, <span style="color:#6A3E3E;">user</span>);</span></p><p><span style="font-size:18px;"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">re</span>.put(<span style="color:#2A00FF;">&quot;ok&quot;</span>,<strong><span style="color:#7F0055;">true</span></strong>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">re</span>.put(<span style="color:#2A00FF;">&quot;msg&quot;</span>, <span style="color:#2A00FF;">&quot;user/goIndex&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong><span style="color:#6A3E3E;">re</span>;<span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">对象</span></span></p><p><span style="font-size:18px;"> }</span></p><p><span style="font-size:18px;">&nbsp;</span></p><p> <span style="color:#646464;"><span style="font-size:18px;">@At</span></span></p><p> <span style="font-size:18px;"><span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;beetl:web/admin.html&quot;</span>)<span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">用户登录成功，跳转到后台管理页面</span></span></p><p> <span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span><span style="color:#7F0055;">void</span></strong> goIndex(HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; User <span style="color:#6A3E3E;">loginuser</span>=(User)<span style="color:#6A3E3E;">session</span>.getAttribute(<span style="color:#2A00FF;">&quot;me&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">req</span>.setAttribute(<span style="color:#2A00FF;">&quot;user&quot;</span>, <span style="color:#6A3E3E;">loginuser</span>);</span></p><p><span style="font-size:18px;"> }</span></p><p><span style="font-size:18px;">}</span></p><br />  </td>
        </tr>
        <tr>
          <td class="col0">3.5.9 匹配视图</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">通过注解<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">@Ok&nbsp;</span>和<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">@Fail&nbsp;</span>可以为入口函数声明不同的视图渲染方式。执行一个业务逻辑可 能有两种结果：</p><p class="s11" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: Wingdings; font-size: 9pt;">?&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">成功，正常返回。</span></p><p class="s11" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: Wingdings; font-size: 9pt;">?&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">失败，特指入口方法抛出异常。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""></p><p><span style="font-size:18px;"><span style="font-family:'Segoe UI','sans-serif';color:#292B2C;background:white;">@Ok</span><span style="font-family:宋体;color:#292B2C;background:white;">和</span><span style="font-family:'Segoe UI','sans-serif';color:#292B2C;background:white;">@Fail</span><span style="font-family:宋体;color:#292B2C;background:white;">两个注解的值只能是一个字符串，它们的格式是：</span></span></p><p style="text-align:center;"><strong><span style="font-size:18px;"><span style="font-family:'Segoe UI','sans-serif';color:#292B2C;background:white;">&quot;</span><span style="font-family:宋体;color:red;background:white;">视图类型</span><span style="font-family:'Segoe UI','sans-serif';color:#292B2C;background:white;">:</span><span style="font-family:宋体;color:#292B2C;background:white;">视图值</span><span style="font-family:'Segoe UI','sans-serif';color:#292B2C;background:white;">&quot;</span></span></strong></p><p><span style="font-size:18px;"><span style="font-family:宋体;">视图的任务就是将入口函数的返回值（一个</span>Java<span style="font-family:宋体;">对象）渲染到</span> HTTP <span style="font-family:宋体;">响应流中。</span><span style="font-family:宋体;background:white;">那么怎么通过字符串，匹配到视图呢？</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">现在</span> Nutz.Mvc<span style="font-family:宋体;">自带的主要视图类型有：</span></span></p><p><span style="font-size:18px;">1)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>JSP <span style="font-family:宋体;">－</span> <span style="font-family:宋体;">采用</span> JSP <span style="font-family:宋体;">模板输出网页</span></span></p><p><span style="font-size:18px;">2)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>Redirect <span style="font-family:宋体;">－按照给定的视图值，发送</span> HTTP <span style="font-family:宋体;">重定向命令到客户端</span></span></p><p><span style="font-size:18px;">3)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>Forward <span style="font-family:宋体;">－</span> <span style="font-family:宋体;">服务器端中转，按照给定的视图值，服务器内部重定向到指定的地址</span></span></p><p><span style="font-size:18px;">4)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>Json <span style="font-family:宋体;">－</span> <span style="font-family:宋体;">将对象输出成</span> Json <span style="font-family:宋体;">字符串</span></span></p><p><span style="font-size:18px;">5)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>void – <span style="font-family:宋体;">空白视图，对</span> HTTP <span style="font-family:宋体;">输出流不做任何处理，空实现</span></span></p><p><span style="font-size:18px;">6)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>Raw - <span style="font-family:宋体;">二进制输出，图片输出，文件下载等</span></span></p><p><span style="font-size:18px;">Nutz.Mvc<span style="font-family:宋体;">支持定制自己的视图规则，例如</span><span style="color:#2A00FF;">&quot;beetl:web/admin.html&quot;</span><span style="font-family:宋体;">，指定用模板引擎</span>Beetl<span style="font-family:宋体;">渲染</span>HTTP<span style="font-family:宋体;">输出流输出</span>WEB-INF/web<span style="font-family: 宋体;">目录下的</span>admin.html<span style="font-family: 宋体;">页面</span><span style="font-family:宋体;">。</span></span></p><span style="font-size:18px;"><span style="font-family: 宋体;">为了验证成功登录，在</span><span style="font-family: Times New Roman, serif;">WebRoot\WEB-INF\web</span><span style="font-family: 宋体;">目录下，新建一个</span><span style="font-family: Times New Roman, serif;">admin.html</span><span style="font-family: 宋体;">页面，作为输出的目标视图。</span><br /></span><br />  </td>
        </tr>
        <tr>
          <td class="col0">3.5.10 Beetl配置</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">conf&nbsp;</span>目录下创建&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">beetl.properties</span>，添加一条配置项设置根路径，其他的采用默认值。</p><p style="margin: 0pt; padding: 3pt 0px 0px 47pt; font-family: times new roman serif; font-size: 9pt"><strong><span style="font-size:10.0pt;font-family:'Times New Roman','serif';color:red;">RESOURCE.root=/WEB-INF/</span></strong><br /><br /></p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="" line-height:="" 28px="" text-align:="" justify="">Web&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">项目系统中，除系统首页以外，其他前端页面都可以使用&nbsp;</span>Beetl&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">模板引擎渲染，</span>Beetl&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">远超过主流&nbsp;</span>Java&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">模板引擎性能（引擎性能&nbsp;</span>5<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">～</span>6&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">倍与&nbsp;</span>freemaker<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">，</span>2&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">倍于&nbsp;</span>JSP<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">），而且消耗较低 的&nbsp;</span>CPU<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">。使用&nbsp;</span>Beetl&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">的目的是将模板文件和数据通过模板引擎快速生成最终的&nbsp;</span>HTML&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">代码， 通过浏览器呈现出来。</span></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.5.11 退出系统</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">为了验证退出系统功能，修改</span>admin.html<span style="font-family:宋体;">页面，在页面上添加一个</span>easyui<span style="font-family:宋体;">按钮，按钮的点击事件为请求登出系统。</span></span></p><p><span style="font-size:18px;">1. <span style="font-family:楷体_GB2312;">引用</span>js<span style="font-family:楷体_GB2312;">和</span>css</span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/themes/default/easyui.css&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/themes/icon.css&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/js/jquery.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/jquery.easyui.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/locale/easyui-lang-zh_CN.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">2. <span style="font-family:楷体_GB2312;">添加按钮</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">a</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;logout&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;#&quot;</span></em> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-linkbutton&quot;</span></em> <span style="color:#7F007F;">data-options</span>=<em><span style="color:#2A00FF;">&quot;iconCls:'icon-cancel'&quot;</span></em><span style="color:teal;">&gt;</span><span style="font-family:宋体;">我要退出系统</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">a</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">3. <span style="font-family:楷体_GB2312;">添加按钮事件</span></span></p><p><span style="background:white;"><span style="font-size:18px;">$(<strong><span style="color:#7F0055;">function</span></strong>(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">$(<span style="color:#2A00FF;">&quot;#logout&quot;</span>).click(<strong><span style="color:#7F0055;">function</span></strong>(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; top.location.href=<span style="color:#2A00FF;">&quot;${ctxPath}/user/doLogout&quot;</span>;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">});</span></span></p><p><span style="background:white;"><span style="font-size:18px;">});</span></span></p><p><span style="font-size:18px;">4. <span style="font-family:楷体_GB2312;">全局变量</span>ctxPath</span></p><p><span style="font-size:18px;">ctxPath<span style="font-family:宋体;">是</span>Beetl<span style="font-family:宋体;">中的默认变量，表示</span>ServletContext Path<span style="font-family:宋体;">。使用方法是，用默认占位符号</span><span style="color:red;">${ }</span><span style="font-family:宋体;">将变量括起来</span><span style="color:red;background:white;">${</span><span style="color:#2A00FF;background:white;">ctxPath</span><span style="color:red;background:white;">}</span><span style="font-family:宋体;">，代表当前项目在浏览器地址栏中显示的路径，如</span>http://localhost:8080/newsnutz <span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在前端页面中请求</span>/user/doLogout<span style="font-family:宋体;">时，</span>UserAct<span style="font-family:宋体;">子模块中添加响应该请求的方法，退出系统前，必须使得</span>session<span style="font-family:宋体;">中保存的信息失效，然后</span>@Ok(&quot;&gt;&gt;:/&quot;)<span style="font-family:宋体;">跳转到系统首页。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;&gt;&gt;:/&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span><span style="color:#7F0055;">void</span></strong> doLogout(HttpSession <span style="color:#6A3E3E;">session</span>) {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">session</span>.invalidate();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p></td>
        </tr>
        <tr>
          <td class="col0">3.5.12 密码加密</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">为了减少重复代码的编写，提高开发效率，往往需要进行代码复用，</span> <span style="font-family:宋体;">就是把一个功能写成一个方法，以便当再次需要相同功能的时候，可以直接使用，而不用重新编码实现。在</span>cn.lrw.newsnutz.utils<span style="font-family:宋体;">包中创建</span>BaseAct<span style="font-family:宋体;">类，在这个类中封装各种公用的方法。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>1<span style="font-family:宋体;">）字符串加密方法。调用</span>Shiro<span style="font-family:宋体;">中的</span>SHA<span style="font-family:宋体;">加密算法，可用于密码的不可逆加密。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">protected</span></strong> StringlrwCode(String <span style="color:#6A3E3E;">text</span>,String <span style="color:#6A3E3E;">salt</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(<span style="color:#6A3E3E;">salt</span>.equals(<span style="color:#2A00FF;">&quot;&quot;</span>))<span style="color:#6A3E3E;">salt</span>=<span style="color:#2A00FF;">&quot;abcdefghijklmnopqrstuvwx&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span> <span style="color:#7F0055;">new</span></strong> Sha256Hash(<span style="color:#6A3E3E;">text</span>,<span style="color:#6A3E3E;">salt</span>,1024).toBase64();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>2<span style="font-family:宋体;">）修改</span>UserAct<span style="font-family:宋体;">类，使其继承新建的</span>BaseAct<span style="font-family:宋体;">类</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span><span style="color:#7F0055;">class</span></strong> UserAct <strong><span style="color:#7F0055;">extends</span></strong> BaseAct {</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>UserAct<span style="font-family:宋体;">的登录方法</span>doLogin<span style="font-family:宋体;">中调用此方法</span></span></p><p><span style="font-size:18px;">String <span style="color:#6A3E3E;">p</span>=lrwCode(<span style="color:#6A3E3E;">pwd</span>,<span style="color:#2A00FF;">&quot;&quot;</span>);</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">if</span></strong> (!<span style="color:#6A3E3E;">p</span>.equals(<span style="color:#6A3E3E;">user</span>.getPwd())) {</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>3<span style="font-family:宋体;">）修改</span>MainSetup<span style="font-family:宋体;">中的初始化密码</span></span></p><p><span style="font-size:18px;">String <span style="color:#6A3E3E;">salt</span>=<span style="color:#2A00FF;">&quot;abcdefghijklmnopqrstuvwx&quot;</span>;</span></p><p><span style="font-size:18px;"><span style="color:#6A3E3E;">user</span>.setPwd(<strong><span style="color:#7F0055;">new</span></strong> Sha256Hash(<span style="color:#2A00FF;">&quot;123&quot;</span>,<span style="color:#6A3E3E;">salt</span>, 1024).toBase64());</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>4<span style="font-family:宋体;">）删除数据库</span>user<span style="font-family:宋体;">表中记录</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>5<span style="font-family:宋体;">）重新运行项目，将加密的数据写入数据库，测试登录跳转功能。</span></span></p></td>
        </tr>
        <tr>
          <td class="col0">3.5.13 登录Filter</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">为了防止用户不登录系统就能够查看或改动系统中的敏感数据，往往在用户请求某种操作（登录、注册除外）前，系统自动检查用户是否已经登录，如果没有登录则返回登录页面。为了给用户一个比较明确的提示信息，我们可以在</span>WebRoot\error<span style="font-family:宋体;">目录下，新建一个</span>nologin.html<span style="font-family:宋体;">页面，页面提示登录失效，</span>2<span style="font-family:宋体;">秒钟后跳转到登录页面（系统首页）。</span></span></p><p><span style="font-size:18px;"><strong>nologin.html</strong><span style="font-family:宋体;">页面</span>Body<span style="font-family:宋体;">中的内容如下，主要用于提示是否有效登录，当然可以设计实现很漂亮的提示页面风格和提示信息。</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&lt;<strong>h1</strong>&gt;</span><span style="font-family:宋体;color:#444444;">登录失效</span><span style="color:#444444;">&lt;/<strong>h1</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&lt;<strong>p</strong>&gt;</span><span style="font-family:宋体;color:#444444;">对不起，您没有登录或者登录已超时。</span><span style="color:#444444;">&lt;/<strong>p</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&lt;<strong>script</strong> type=</span><span style="color:#880000;">&quot;text/javascript&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; setTimeout(reDo,</span><span style="color:#880000;">2000</span><span style="color:#444444;">);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>function</strong></span><strong><span style="color:#880000;">reDo</span></strong><span style="color:#444444;">(){ top.location.href = </span><span style="color:#880000;">&quot;../&quot;</span><span style="color:#444444;">;}</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&lt;/<strong>script</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>cn.lrw.newsnutz.utils<span style="font-family:宋体;">包中创建</span>LoginFilter<span style="font-family:宋体;">类实现接口</span>ActionFilter<span style="font-family:宋体;">，检查用户是否登录（检查当前</span>Session<span style="font-family:宋体;">是否带有</span>me<span style="font-family:宋体;">这个</span>Attribute<span style="font-family:宋体;">），从而确定是否允许执行请求的某种操作。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">class</span></strong>LoginFilter <strong><span style="color:#7F0055;">implements</span></strong> ActionFilter {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Override</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span></strong> View match(ActionContext<span style="color:#6A3E3E;">context</span>) {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; HttpServletRequest <span style="color:#6A3E3E;">request</span>= <span style="color:#6A3E3E;">context</span>.getRequest();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; User <span style="color:#6A3E3E;">user</span> = (User) <span style="color:#6A3E3E;">request</span>.getSession().getAttribute(<span style="color:#2A00FF;">&quot;me&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String <span style="color:#6A3E3E;">contentType</span>= <span style="color:#6A3E3E;">request</span>.getContentType();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong> (<span style="color:#6A3E3E;">user</span> == <strong><span style="color:#7F0055;">null</span></strong>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(Strings.<em>sNull</em>(<span style="color:#6A3E3E;">contentType</span>).contains(<span style="color:#2A00FF;">&quot;application/x-www-form-urlencoded&quot;</span>)) </span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">context</span>.getResponse().setHeader(<span style="color:#2A00FF;">&quot;sessionstatus&quot;</span>, <span style="color:#2A00FF;">&quot;timeout&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ServerRedirectView <span style="color:#6A3E3E;">view</span>= <strong><span style="color:#7F0055;">new</span></strong> ServerRedirectView(<span style="color:#2A00FF;">&quot;/error/nologin.html&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong><span style="color:#6A3E3E;">view</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">request</span>.setAttribute(<span style="color:#2A00FF;">&quot;me&quot;</span>, <span style="color:#6A3E3E;">user</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span> <span style="color:#7F0055;">null</span></strong>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">}</span></p><p><span style="font-size:18px;">&nbsp;</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">接下来，稍微修改一下</span>UserAct<span style="font-family:宋体;">类，其中用到</span>@Filters<span style="font-family:宋体;">注解。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span>@Filters({@By(type=LoginFilter.class)})<span style="font-family:宋体;">，请求执行</span>UserAct<span style="font-family:宋体;">类中的方法，必须先通过</span>Filter<span style="font-family:宋体;">中的检验。</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@Filters</span>({<span style="color:#646464;">@By</span>(type=LoginFilter.<strong><span style="color:#7F0055;">class</span></strong>)})</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">class</span></strong>UserAct <strong><span style="color:#7F0055;">extends</span></strong> BaseAct{</span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span>@Filters()<span style="font-family:宋体;">，用户登录肯定无法通过</span>Filter<span style="font-family:宋体;">检验，所以在</span>doLogin<span style="font-family:宋体;">方法前添加一个无参数的</span>@Filters()<span style="font-family:宋体;">，表示临时屏蔽</span>Filter<span style="font-family:宋体;">检验，允许没有登录的用户请求执行</span>doLogin<span style="font-family:宋体;">方法。</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@Filters</span>()</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span></strong> Object doLogin(</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">重新运行项目，查看是否能正常登录跳转；查看是否在退出后，在浏览器地址栏输入：</span><a href="http://localhost:8080/newsnutz/user/goIndex">http://localhost:8080/newsnutz/user/goIndex</a><span style="font-family:宋体;">，回车，能否直接访问后台管理页面</span>admin.html<span style="font-family:宋体;">，这个页面应该是用户登录后才能访问的。如果你的</span>Filter<span style="font-family:宋体;">使用正确，由于没有权限直接访问</span>admin.html<span style="font-family:宋体;">，会自动跳转到</span>error/nologin.html<span style="font-family:宋体;">页面。</span></span></p></td>
        </tr>
        <tr>
          <td class="col0">3.6 考核任务</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）具有布局合理且友好的首页。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">20&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）设置标题前的图标。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">5&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）能够正常登录跳转。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">40&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">4</span>）能够正常退出系统。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">10&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">5</span>）输入错误的登录信息或者不输入，执行“登录”应有相应明确的提示。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">15&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">6</span>）友好的弹出信息框。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">10&nbsp;</span>分）</p> </td>
        </tr>
        <tr>
          <td class="col0">3.7 调试方法</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">在软件开发过程中，掌握了借助开发工具进行软件调试的方法，就可以通过各种调试方法的<span style="font-size: 18px;">应用，更快地定位问题出现的位置，从而有针对性地分析问题、解决问题，软件开发效率能够得 到更大程度的提高。</span></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">软件开发的难点在于不会调试、不会排（除）错（误）。所以学会各种调试方法，尤其是 常用的方法并熟练掌握，在软件开发过程中，就能做到事半功倍，否则会把大量的时间消耗在 排错工作上，时间长了，就会丧失信心、失去学习的兴趣和动力。</p>  </td>
        </tr>
        <tr>
          <td class="col0">3.7.1 后端调试</td>
          <td class="col1"><p style="margin: 0pt; padding: 0px 0px 0px 35pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"></span></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">后端调试需要借助开发平台（编译工具），如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">MyEclipse</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Eclipse</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Intellij IDEA&nbsp;</span>等，采用 查看日志和断点跟踪等方法。</p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""><strong><span style="color:#ff0000;">1<span class="s24" style="margin: 0px; padding: 0px; font-family: 楷体, monospace; font-size: 18px;">．查看日志</span></span></strong></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">因为添加了&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Log4j&nbsp;</span>日志系统，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Console&nbsp;</span>控制台会显示很多关于系统启动、运行、停止的日 志信息。在项目启动后，通过查看&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Console&nbsp;</span>中的日志或报错（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Exception</span>）信息，能解决一部分 突出的问题，如语法错误、数据库配置错误等。查看日志的方法是首先把&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Console&nbsp;</span>窗口右边的 滚动条拖动到最上方；然后从上往下滑动滚动条，找到第&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">1&nbsp;</span>个出现&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Exception</span>（通常是蓝色字） 的位置，然后根据异常出现位置的上下文，分析异常产生的原因，找到解决异常的方法。有时 候会出现很多异常信息，但解决了前面的异常，后面的异常也就不存在了。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">有经验的开发调试人员对于常见的异常一看就知道导致异常的原因和解决方法；对于初 学者来说，需要积累经验，首先是会用网络资源，然后才是问老师（能者为师），因为网络资 源一直都在，而老师不一定能及时响应。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;"><strong><span style="color:#000066;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">1</span>）异常样例&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">1</span>—数据库未启动。</span></strong></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="" line-height:="" 28px="">1<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）现象。图&nbsp;</span>3-24&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">所示是控制台显示的日志，日志中提示有&nbsp;</span>CommunicationsException&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">异 常，原因是&nbsp;</span>Communications link failure<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">。提示信息表明无法连接数据库。</span></p><br /><p style="margin: 0pt; padding: 0px 0px 0px 35pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_041.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-24 Console&nbsp;</span>日志—<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">CommunicationsException&nbsp;</span>异常</p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">2<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）分析。造成异常的原因可能是配置文件中使用的数据库没有启动运行。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">3<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）解决。启动数据库，再运行项目。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;"><strong><span style="color:#000066;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">2</span>）异常样例&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">2</span>—数据库配置错误。</span></strong></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">1<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）现象。图&nbsp;</span>3-25&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">所示是控制台显示的日志，日志中提示有&nbsp;</span>SQLException&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">异常，原因是</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 5pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Access denied for user 'root'@'localhost' (using password: NO)<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">。提示信息表明数据库拒绝访问。</span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 19pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_042.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 26pt; text-indent: 102pt; font-family: 宋体; font-size: 9pt;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt">3-25 Console&nbsp;</span>日志—<span class="p" style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt">SQLException&nbsp;</span>异常</p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 26px="" text-align:="" justify="">2<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）分析。造成异常的原因可能有：配置文件中数据库名称错误、访问数据库的用户名或 密码有错误。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">3<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）解决。打开&nbsp;</span>conf/ioc/dao.js<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">，检查并修改其中数据库的配置信息。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;"><strong><span style="color:#000066;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">3</span>）异常样例&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">3</span>—<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Java&nbsp;</span>方法错误。</span></strong></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 4px="" text-align:="" justify="">1<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）现象。图&nbsp;</span>3-26&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">所示是控制台显示的日志，日志中提示有&nbsp;</span>Error<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">，原因是&nbsp;</span>The method lrwcode(String, String) is undefined for the type UserAct<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">，提示信息表明存在编译错误，在&nbsp;</span>UserAct&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">类中未定义方法&nbsp;</span>lrwcode(String,String)<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">。日志中还显示&nbsp;</span>Error&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">产生的位置信息：</span>UserAct.java&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">文 件的第&nbsp;</span>35&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">行，处于&nbsp;</span>doLogin&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">方法内部。</span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 20pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_043.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-26 Console&nbsp;</span>日志—<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">lang.Error</span></p><p class="s6" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 4px="" text-align:="" justify="">2<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）分析。造成这种异常的原因可能有：方法名有误，方法参数有误或者确实没有定义过 提示信息中的方法。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 26px="">3<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">）解决。如果方法有误，修改；如果没有定义，添加方法的定义。 不同的开发人员、同一开发人员在不同开发场景，一般都会遇到异常或错误，无法列举</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; font-family: 宋体; font-size: 18px;">所有可能的问题，所以需要开发人员在开发过程中，不断积累经验。</p><p class="s6" style="margin: 0pt; padding: 2pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt=""><strong><span style="color:#ff0000;">2<span class="s24" style="margin: 0px; padding: 0px; font-family: 楷体, monospace; font-size: 18px;">．断点跟踪</span></span></strong></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 15.82px; text-align: justify;">在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Java&nbsp;</span>编写的方法中，可以在代码行前面添加断点。以&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">debug&nbsp;</span>模式运行项目，运行到断 点时，可以单步跟踪调试，可以查看前端传来的参数值，可以查看业务处理后的属性值，可以 查看业务处理过程中的异常信息等。学会断点跟踪可以帮助分析问题可能出现在代码的什么位</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 18px;">置及原因，最终根据原因找出解决方案。</p><p class="s24" style="margin: 0pt; padding: 2pt 0px 0px 26pt; font-family: 楷体, monospace; font-size: 18px;"><span style="color:#ff0000;"><span class="s7" style="margin: 0px; padding: 0px; font-family: 黑体, monospace; font-size: 18px;">注意：</span>不要在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">MainSetup&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">init&nbsp;</span>方法中加断点，这会导致&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">debug&nbsp;</span>模式启动超过&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">45s</span>。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">单步调试有三种方法，根据实际情况选择单步调试方法，在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">MyEclipse&nbsp;</span>的工具栏上有相应 的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">3&nbsp;</span>个按钮<span style="margin: 0px; padding: 0px; text-indent: 0px;"><img th:src="@{/assets/javaeeimg/Image_044.png}" style="margin: 0px; padding: 0px;" alt="" /></span>及快捷键。</p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 47pt; text-indent: -21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 26px="" text-align:="" justify=""><span class="s11" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Wingdings; font-size: 9pt;">?&nbsp;</span>Step Into<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">（</span>F5<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）：单步执行，如果该行有自定义方法，则运行进入自定义方法（不会 进入官方类库的方法）。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 47pt; text-indent: -21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 4px="" text-align:="" justify=""><span class="s11" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Wingdings; font-size: 9pt;">?&nbsp;</span>Step Over<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">（</span>F6<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）：单步执行，如果当前行有方法调用，这个方法将被执行完毕返回， 然后到下一行。</span></p><p class="s6" style="margin: 0pt; padding: 1pt 0px 0px 47pt; text-indent: -21pt; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="" line-height:="" 15="" 4px="" text-align:="" justify=""><span class="s11" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Wingdings; font-size: 9pt;">?&nbsp;</span>Step Return<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">（</span>F7<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">）：当单步执行到一个方法的内部，但觉得该方法没有问题，就可 以使用&nbsp;</span>Step Return&nbsp;<span class="s5" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: 宋体; font-size: 18px;">执行完当前方法的余下部分，并返回到该方法被调用处的下一 行语句。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">如果想直接执行到下一个断点，单击<span style="margin: 0px; padding: 0px; text-indent: 0px;"><img th:src="@{/assets/javaeeimg/Image_045.png}" style="margin: 0px; padding: 0px;" alt="" /></span><span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Resume</span>，程序将运行当前断点到下一个断点之间 需要执行的代码。如果后面代码没有断点，再次单击该按钮将会执行完程序。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">如果不想再继续，单击<span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_046.png}" style="margin: 0px; padding: 0px;" alt="" /></span><span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Terminate&nbsp;</span>停止项目的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">debug&nbsp;</span>运行。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">以用户登录为样例，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">3-27&nbsp;</span>所示，在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">doLogin&nbsp;</span>方法内的第&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">1&nbsp;</span>行的行号（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">28</span>）左边空白 处，双击添加一个断点（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">BreakPoints</span>、双击断点可以取消当前断点）。断点的添加，可以在项 目运行前、也可以在项目运行后。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_047.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 2pt 0px 0px 5pt; font-family: 宋体; font-size: 9pt; text-align: center;"><span style="font-size: 9pt;">图&nbsp;</span><span class="p" style="font-size: 9pt; margin: 0pt; padding: 0px; font-family: " times="" new="" roman="" serif="">3-27&nbsp;</span><span style="font-size: 9pt;">后端断点跟踪</span><br /></p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">以&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt=""><strong><span style="color:#000099;">debug&nbsp;</span></strong></span>模式运行当前项目，在浏览器中打开系统的登录页，输入用户名和密码后到系 统；当运行到断点时，断点处显示有一个向左的箭头，表示程序执行到当前行已暂停；按两 次热键&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">F6</span>，程序执行到第&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">30&nbsp;</span>行。单击菜单&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Window&nbsp;</span>茂，选择&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Show View&nbsp;</span>中的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Expressions&nbsp;</span>命令，打开&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 10="" 5pt="">Expressions&nbsp;</span>表达式视图，输入需要查看的属性名、参数名或对象名，就可以看 到它们当前的值。</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 16.24px; text-align: justify;">如果查看的值，不是预计的值，则要往回查；如果是没有取到前端传过来的参数值，则 甚至要检查前端的业务逻辑。</p>   </td>
        </tr>
        <tr>
          <td class="col0">3.7.2 前端调试  </td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 26px;">前端调试需要借助浏览器的开发者工具，如&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">DevTool</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Firebug&nbsp;</span>或者&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Firefox DevTools&nbsp;</span>等。 建议使用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">360&nbsp;</span>极速浏览器的极速模式，其他国产浏览器的极速模式、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Chrome&nbsp;</span>浏览器等也可以。</p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""><strong><span style="color:#ff0000;">1<span class="s24" style="margin: 0px; padding: 0px; font-family: 楷体, monospace; font-size: 18px;">．断点跟踪</span></span></strong></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">运行项目，确保控制台没有异常、没有错误。在浏览器中打开项目登录页面，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-28&nbsp;</span>所示。调出浏览器的“开发者工具”（大部分浏览器通常用快捷键&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">F12</span>），选择&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Sources&nbsp;</span>面板， 展开左边区域树形资源，选择&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">include/js/login.js</span>，在中间区域&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">login.js&nbsp;</span>的&nbsp;<span class="h1" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-weight:="" bold="" font-size:="" 18px="">javascript&nbsp;</span>代码单击行 号&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">98</span>，即可以添加一个断点，如果单击断点，则是取消该断点。展开右边区域&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Watch</span>，添加</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; font-family: 宋体; font-size: 18px; line-height: 16.24px;">（输入）需要查看的变量、表达式或对象，则可以看到它们在程序执行到断点时的值。可以单 步调试、也可以继续执行到下一断点。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 14pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_048.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 4pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-28&nbsp;</span>前端断点跟踪</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 16.24px; text-align: justify;">如果查看的值，不是预计的值，则要往回查；如果是没有取到后端传过来的值，可能需 要检查后端的业务逻辑。</p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""><strong><span style="color:#ff0000;">2<span class="s24" style="margin: 0px; padding: 0px; font-family: 楷体, monospace; font-size: 18px;">．查看代码与&nbsp;</span>CSS</span></strong></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">在浏览器开发者工具中打开&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Elements&nbsp;</span>面板，可以查看、查找网页源代码&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">HTML&nbsp;</span>中的任一 元素及其用到的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">js/css/image&nbsp;</span>文件等，如果手动修改任一元素的属性和样式则能实时在浏览器 里面得到反馈，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-29&nbsp;</span>所示，当前选中了&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">id&nbsp;</span>为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">login_form&nbsp;</span>的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">div&nbsp;</span>元素，右边显示了这个元 素上的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">css</span>，可以临时手工调整它的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">css&nbsp;</span>属性和属性值，查看即时反馈的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">UI&nbsp;</span>界面效果，如果觉 得合适，就参照临时修改后的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">css</span>，修改或添加到源文件中。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 30pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_049.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s6" style="margin: 0pt; padding: 9pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""><strong><span style="color:#ff0000;">3<span class="s24" style="margin: 0px; padding: 0px; font-family: 楷体, monospace; font-size: 18px;">．查看网络请求信息</span></span></strong></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-29&nbsp;</span>查看、修改&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">html&nbsp;</span>代码或&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">css</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">在浏览器开发者工具中打开&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Network&nbsp;</span>面板，从发起网页页面请求&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Request&nbsp;</span>后，分析&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">HTTP&nbsp;</span>请求后得到的各个请求资源信息（包括状态、资源类型、大小、所用时间等），可以根据这 个进行网络性能优化。选择一个向后端发起的请求，例如登录&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">doLogin</span>，则可以查看请求 时的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Headers&nbsp;</span>消息和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">response&nbsp;</span>的数据消息，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-30&nbsp;</span>所示，这是后端服务器响应&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">response&nbsp;</span>的消息。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 30pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_050.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 47pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-30&nbsp;</span>网络请求信息</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s6" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""><span style="color:#ff0000;"><strong>4<span class="s24" style="margin: 0px; padding: 0px; font-family: 楷体, monospace; font-size: 18px;">．查看所有资源</span></strong></span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height:28px;">在浏览器开发者工具中打开&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Application&nbsp;</span>面板，可以看到当前网页加载的所有资源信息， 包括存储数据（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Local Storage</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Session Storage</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">IndexedDB</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Web SQL</span>、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Cookies</span>）、缓存数据、 字体、图片、脚本、样式表等。</p>  </td>
        </tr>
        <tr>
          <td class="col0">3.8 新闻管理</td>
          <td class="col1"><span style="font-family: 宋体; text-align: justify; text-indent: 28px;"><span style="font-size:18px;">俗话说“万事开头难”，当运用调试方法使前面的简单项目运行正常、功能正常以后，会 更顺利地完成项目的其他功能。</span></span><br />  </td>
        </tr>
        <tr>
          <td class="col0">3.8.1 后台Layout</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">网页布局是网站前端设计的重中之重，如何把文字、图片等网页元素有规则地排列在网 页中，达到良好的视觉效果，是网页布局要考虑的重要方面。网站选择什么样的布局直接影响 到访客在浏览器上看到的整体效果，页面设计得好与不好，直接影响到访客在网站的停留时间 长短。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 16.24px; text-align: justify;">好的网页布局不仅具有好的页面效果，而且能够让前端开发人员更好地把握网页的整体 结构，提高代码的书写效率，具有复用性和可维护性。</p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">网页布局有很多种，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>提供的布局是比较通用的布局模式，通过组合可以演变成很 多种流行的布局形式。如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-31&nbsp;</span>所示，<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>布局（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Layout</span>）是有五个区域（北区&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">North</span>、 南区&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">South</span>、东区&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">East</span>、西区&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">West&nbsp;</span>和中区&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Center</span>）的容器。中间的区域面板是必需的，边 缘区域面板是可选的。每个边缘区域面板可通过拖拽边框调整尺寸，也可以通过单击折叠触发 器来折叠面板。布局（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Layout</span>）可以嵌套，因此用户可建立复杂的布局。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 72pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_051.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 5pt 0px 0px 4pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-31 EasyUI&nbsp;</span>布局（<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">Layout</span>）</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 15.26px; text-align: justify;">修改前面创建的简单后台管理页&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">admin.html</span>，添加&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>布局&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Layout&nbsp;</span>和&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI Tabs&nbsp;</span>选 项卡。</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 15.26px; text-align: justify;"></p><p><span style="font-family:宋体;">如图</span>3-32<span style="font-family:宋体;">所示，在后台管理页面使用默认布局中的</span>4<span style="font-family:宋体;">个区域（</span>north<span style="font-family:宋体;">、</span>west<span style="font-family:宋体;">、</span>south<span style="font-family:宋体;">和</span>center<span style="font-family:宋体;">），暂时没有使用</span>east<span style="font-family:宋体;">区域，分别在不同的区域，放置不同类型的内容。通用的做法是</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><strong>north</strong><span style="font-family:宋体;">区域放置系统</span>logo<span style="font-family:宋体;">、已登录用户的名称、退出按钮或链接</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><strong>west</strong><span style="font-family:宋体;">区域加载树形菜单</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><strong>south</strong><span style="font-family:宋体;">区域显示版权信息</span></p><p><span style="font-family:Wingdings;">l<span style="font-size:7pt;font-family:'Times New Roman';">&nbsp; </span></span><strong>center</strong><span style="font-family:宋体;">区域使用tab来展示内容窗口</span></p><br /><div style="margin:0 auto;width: 900px;"><table cellspacing="0" style="margin: 0px 0px 0px 48.45pt; padding: 0px; vertical-align: top; overflow: visible; font-family: microsoft yahei; font-size:16px" border-collapse:="" collapse=""><tbody style="margin: 0px; padding: 0px; vertical-align: top; overflow: visible;"><tr style="margin: 0px; padding: 0px; height: 33pt;"><td colspan="2" style="margin: 0px; padding: 0px; width: 330pt; border-style: solid; border-width: 1pt; background-color: rgb(13, 195, 224);"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px; font-family: times new roman serif; font-size: 9pt" text-align:="" center="">North</p><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px; font-family: 宋体; font-size: 9pt; text-align: center;">系统&nbsp;<span class="s17" style="margin: 0px; padding: 0px; font-family: times new roman serif; font-size: 9pt">logo</span>、登录用户的名称、“退出”按钮或链接</p></td></tr><tr style="margin: 0px; padding: 0px; height: 74pt;"><td bgcolor="#000000" style="margin: 0px; padding: 0px; width: 66pt; border-style: solid; border-width: 1pt;"><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s30" style="margin: 0pt; padding: 0px; color: rgb(255, 255, 255); font-family: times new roman serif; font-size: 9pt" text-align:="" center="">West</p><p class="s31" style="margin: 0pt; padding: 3pt 0px 0px; color: rgb(255, 255, 255); font-family: 宋体; font-size: 9pt; text-align: center;">树形菜单</p></td><td style="margin: 0px; padding: 0px; width: 264pt; border-style: solid; border-width: 1pt;"><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s17" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt" text-align:="" center="">Center</p><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px; font-family: 宋体; font-size: 9pt; text-align: center;">内容主窗口</p></td></tr><tr style="margin: 0px; padding: 0px; height: 33pt;"><td colspan="2" bgcolor="#DFDFDF" style="margin: 0px; padding: 0px; width: 330pt; border-style: solid; border-width: 1pt;"><p class="s17" style="margin: 0pt; padding: 3pt 0px 0px; font-family: times new roman serif; font-size: 9pt" text-align:="" center="">South</p><p class="s18" style="margin: 0pt; padding: 3pt 0px 0px; font-family: 宋体; font-size: 9pt; text-align: center;">版权信息</p></td></tr></tbody></table></div><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s9" style="margin: 0pt; padding: 2pt 0px 0px 22pt; text-indent: 141pt; font-family: 宋体; font-size: 9pt;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; text-indent: 0px; font-family: times new roman serif; font-size: 9pt">3-32&nbsp;</span>后台布局示意图</p><p class="s5" style="margin: 0pt; padding: 7pt 0px 0px 4pt; font-family: 宋体; font-size: 18px; text-align: center;"><br /></p><p style="margin: 0pt; padding: 4pt 0px 0px 9pt; font-family: times new roman serif; font-size: 9pt" text-align:="" center=""></p><p><span style="font-family:宋体;"><span style="font-size:18px;">实现上述布局的代码可以是：</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&lt;<strong>body</strong> class=</span><span style="color:#880000;">&quot;easyui-layout&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong>data-options=</span><span style="color:#880000;">&quot;region:'north',border:false&quot;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; style=</span><span style="color:#880000;">&quot;background:#B3DFDA;padding:0 10px 010px;vertical-align: middle;&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>img</strong>src=</span><span style="color:#880000;">&quot;$</span><span style="color:#BC6060;">{ctxPath}</span><span style="color:#880000;">/include/img/logo.png&quot;</span><span style="color:#444444;"> width=</span><span style="color:#880000;">&quot;126&quot;</span><span style="color:#444444;"> height=</span><span style="color:#880000;">&quot;50&quot;</span><span style="color:#444444;">/&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong>style=</span><span style="color:#880000;">&quot;float:right;line-height:50px;margin-right:10px;&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a id=&quot;logout&quot;href=&quot;#&quot; class=&quot;easyui-linkbutton&quot;data-options=&quot;iconCls:'icon-cancel'&quot;&gt;</span><span style="font-family:宋体;color:#444444;">退出</span><span style="color:#444444;">&lt;/a&gt;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/<strong>div</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong>style=</span><span style="color:#880000;">&quot;float:right;line-height:50px;margin-right:10px;&quot;</span><span style="color:#444444;">&gt;</span><span style="font-family:宋体;color:#444444;">登录用户：</span><span style="color:#444444;">$</span><span style="color:#BC6060;">{me.xm}</span><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |&lt;/<strong>div</strong>&gt;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;/<strong>div</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong> data-options=</span><span style="color:#880000;">&quot;region:'west',split:true,title:'</span><span style="font-family:宋体;color:#880000;">系统菜单</span><span style="color:#880000;">'&quot;</span><span style="color:#444444;"> style=</span><span style="color:#880000;">&quot;width:180px;padding:10px;&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>ul</strong>id=</span><span style="color:#880000;">&quot;menutree&quot;</span><span style="color:#444444;"> class=</span><span style="color:#880000;">&quot;easyui-tree&quot;</span><span style="color:#444444;">&gt;&lt;/<strong>ul</strong>&gt;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;/<strong>div</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong> data-options=</span><span style="color:#880000;">&quot;region:'south',border:false&quot;</span><span style="color:#444444;"> style=</span><span style="color:#880000;">&quot;height:30px;padding:5px; text-align:center; font-family:arial;color: #A0B1BB;&quot;</span><span style="color:#444444;">&gt;Copyright&copy; 2017 JavaEE. All Rights Reserved.</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;/<strong>div</strong>&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong>data-options=</span><span style="color:#880000;">&quot;region:'center'&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;<strong>div</strong>id=</span><span style="color:#880000;">&quot;tabs&quot;</span><span style="color:#444444;"> class=</span><span style="color:#880000;">&quot;easyui-tabs&quot;</span><span style="color:#444444;"> fit=</span><span style="color:#880000;">&quot;true&quot;</span><span style="color:#444444;"> border=</span><span style="color:#880000;">&quot;false&quot;</span><span style="color:#444444;">&gt;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/<strong>div</strong>&gt;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; &lt;/<strong>div</strong>&gt;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&lt;/<strong>body</strong>&gt;</span></span></p><br />  </td>
        </tr>
        <tr>
          <td class="col0">3.8.2 Tab 操作</td>
          <td class="col1"><p class="s6" style="margin: 0pt; padding: 9pt 0px 0px 22pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Tab&nbsp;<span class="s5" style="margin: 0px; padding: 0px; font-family: 宋体; font-size: 18px;">选项卡用于在固定大小的区域显示多个选项卡，通过切换选项卡可以看到每个选项卡</span><span style="font-family: 宋体; font-size: 18px;">呈现的不同内容。图&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">3-33&nbsp;</span><span style="font-family: 宋体; font-size: 18px;">所示是&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">Easyui&nbsp;</span><span style="font-family: 宋体; font-size: 18px;">提供的&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px;">Tab&nbsp;</span><span style="font-family: 宋体; font-size: 18px;">控件。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px; text-align: justify;">为了能够在布局的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Center&nbsp;</span>区域，根据所选菜单栏目，动态加载不同的相应内容，在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">include\js\</span>中创建&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">lrwtab.js&nbsp;</span>文件，在文件中自定义三个&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">js&nbsp;</span>函数，实现关闭所有&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Tab</span>、切换&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Tab</span>、 添加&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Tab&nbsp;</span>的功能，然后在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">admin.html&nbsp;</span>页面中引用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">lrwtab.js&nbsp;</span>文件。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 103pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_052.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p class="s6" style="margin: 0pt; padding: 9pt 0px 0px 26pt; font-family: " times="" new="" roman="" serif="" font-size:="" 18px=""></p><p><span style="font-size:18px;">1. <span style="font-family:楷体_GB2312;">关闭所有</span>tab</span></p><p><span style="font-size:18px;">closeAllTabs<span style="font-family:宋体;">函数首先获取所有的</span>tab<span style="font-family:宋体;">，然后逐个关闭。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#444444;">function&nbsp;</span><span style="color:#880000;">closeAllTabs</span></strong><span style="color:#444444;">(){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>var</strong>tabs=$(</span><span style="color:#880000;">&quot;#tabs&quot;</span><span style="color:#444444;">).tabs(</span><span style="color:#880000;">&quot;tabs&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>for</strong>(<strong>var</strong>i=</span><span style="color:#880000;">0</span><span style="color:#444444;">;i&lt;tabs.length;i++){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(</span><span style="color:#880000;">&quot;#tabs&quot;</span><span style="color:#444444;">).tabs(</span><span style="color:#880000;">&quot;close&quot;</span><span style="color:#444444;">,i);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;">2. <span style="font-family:楷体_GB2312;">切换</span>tab</span></p><p><span style="font-size:18px;">swNewTab<span style="font-family:宋体;">函数，首先判断要切换的</span>tab<span style="font-family:宋体;">是否已经存在，如果存在则保持不变，否则关闭所有</span>tab<span style="font-family:宋体;">，再添加一个新</span>tab<span style="font-family:宋体;">，标题名称为</span>newtitle<span style="font-family:宋体;">，将</span>newurl<span style="font-family:宋体;">请求的页面，以</span>iframe<span style="font-family:宋体;">形式嵌入内容窗口。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#444444;">function&nbsp;</span><span style="color:#880000;">swNewTab</span></strong><span style="color:#444444;">(newtitle,newurl){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>($(</span><span style="color:#880000;">'#tabs'</span><span style="color:#444444;">).tabs(</span><span style="color:#880000;">'exists'</span><span style="color:#444444;">,newtitle))<strong>return</strong>;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; closeAllTabs();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; $(</span><span style="color:#880000;">'#tabs'</span><span style="color:#444444;">).tabs(</span><span style="color:#880000;">'add'</span><span style="color:#444444;">,{</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; title:newtitle,</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; content:</span><span style="color:#880000;">'&lt;iframe id=&quot;mainframe&quot;name=&quot;mainframe&quot; scrolling=&quot;auto&quot; height=&quot;99%&quot;width=&quot;99%&quot; frameboder=&quot;0&quot; src=&quot;'</span><span style="color:#444444;">+newurl+</span><span style="color:#880000;">'&quot;&gt;&lt;/iframe&gt;'</span><span style="color:#444444;">,</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; closable:</span><span style="color:#78A960;">true</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;">3. <span style="font-family:楷体_GB2312;">添加</span>tab</span></p><p><span style="font-size:18px;">addNewTab<span style="font-family:宋体;">函数，首先判断要切换的</span>tab<span style="font-family:宋体;">是否已经存在，如果存在则保持不变，否则添加一个新</span>tab<span style="font-family:宋体;">，标题名称为</span>newtitle<span style="font-family:宋体;">，将</span>newurl<span style="font-family:宋体;">请求的页面，以</span>iframe<span style="font-family:宋体;">形式嵌入内容窗口。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#444444;">function&nbsp;</span><span style="color:#880000;">addNewTab</span></strong><span style="color:#444444;">(newtitle,newurl){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>($(</span><span style="color:#880000;">'#tabs'</span><span style="color:#444444;">).tabs(</span><span style="color:#880000;">'exists'</span><span style="color:#444444;">,newtitle))<strong>return</strong>;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; $(</span><span style="color:#880000;">'#tabs'</span><span style="color:#444444;">).tabs(</span><span style="color:#880000;">'add'</span><span style="color:#444444;">,{</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; title:newtitle,</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; content:</span><span style="color:#880000;">'&lt;iframe id=&quot;mainframe&quot;name=&quot;mainframe&quot; scrolling=&quot;auto&quot; height=&quot;99%&quot;width=&quot;99%&quot; frameboder=&quot;0&quot; src=&quot;'</span><span style="color:#444444;">+newurl+</span><span style="color:#880000;">'&quot;&gt;&lt;/iframe&gt;'</span><span style="color:#444444;">,</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; closable:</span><span style="color:#78A960;">true</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">}</span></span></p><br />  </td>
        </tr>
        <tr>
          <td class="col0">3.8.3 封装Tree型数据</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>cn.lrw.newsnutz.pojo<span style="font-family:宋体;">中创建</span>EasyUITree<span style="font-family:宋体;">类，根据</span>easyUI<span style="font-family:宋体;">中</span>Tree<span style="font-family:宋体;">控件的属性，设置</span>easyUITree<span style="font-family:宋体;">对象的属性。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#444444;">public</span></strong><span style="color:#444444;"> <strong>class</strong> </span><strong><span style="color:#880000;">EasyUITree</span></strong><span style="color:#444444;">{</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>private</strong>String id;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>private</strong>String text;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>private</strong>Boolean checked = <strong>false</strong>;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>private</strong>Map&lt;String,Object&gt; attributes;</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>private</strong>String state = </span><span style="color:#880000;">&quot;closed&quot;</span><span style="color:#444444;">;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>public</strong>List&lt;EasyUITree&gt; children;&nbsp;&nbsp;&nbsp; </span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; </span><span style="color:#888888;">//</span><span style="font-family:宋体;color:#888888;">省略了部分</span><span style="color:#888888;">getter/setter</span><span style="font-family:宋体;color:#888888;">方法</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>public</strong>List&lt;EasyUITree&gt; </span><strong><span style="color:#880000;">getChildren</span></strong><span style="color:#444444;">() {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>return</strong>children;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>publicvoid</strong> </span><strong><span style="color:#880000;">setChildren</span></strong><span style="color:#444444;">(List&lt;EasyUITree&gt; children) {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>this</strong>.children= children;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; } </span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>cn.lrw.newsnutz.utils<span style="font-family:宋体;">中创建</span>MenuTree<span style="font-family:宋体;">类，添加</span>menutree<span style="font-family:宋体;">方法，该方法是从数据库的</span>cmenu<span style="font-family:宋体;">表中取出菜单栏目数据，然后封装成</span>json <span style="font-family:宋体;">格式的</span>EasyUITree<span style="font-family:宋体;">数据。如果登录的用户角色不在菜单的</span>permission<span style="font-family:宋体;">中，则不会封装到返回数据中，用户在前端页面也就看不到该菜单栏目。在当前项目中，菜单栏目已适当简化，层级只有</span>2<span style="font-family:宋体;">级、栏目的顺序不能动态调整。实现</span>menutree<span style="font-family:宋体;">方法的代码如下：</span></span></p><p><span style="color:#1F7199;"><span style="font-size:18px;">@At</span></span></p><p><span style="font-size:18px;"><span style="color:#1F7199;">@Ok</span><span style="color:#444444;">(</span><span style="color:#880000;">&quot;raw&quot;</span><span style="color:#444444;">)</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;"> <strong>public</strong> String </span><strong><span style="color:#880000;">menutree</span></strong><span style="color:#444444;">(HttpServletRequest req, HttpSession session){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; User user = (User) session.getAttribute(</span><span style="color:#880000;">&quot;me&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String role=user.getRole();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span style="color:#888888;">//</span><span style="font-family:宋体;color:#888888;">父级菜单</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;Cmenu&gt; menulist=dao.query(Cmenu.class,Cnd.where(</span><span style="color:#880000;">&quot;pid&quot;</span><span style="color:#444444;">,</span><span style="color:#880000;">&quot;=&quot;</span><span style="color:#444444;">,</span><span style="color:#880000;">0</span><span style="color:#444444;">).asc(</span><span style="color:#880000;">&quot;id&quot;</span><span style="color:#444444;">));</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;EasyUITree&gt; eList = <strong>new</strong>ArrayList&lt;EasyUITree&gt;();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(menulist.size() != </span><span style="color:#880000;">0</span><span style="color:#444444;">){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>for</strong> (<strong>int</strong> i = </span><span style="color:#880000;">0</span><span style="color:#444444;">;i &lt; menulist.size(); i++) {</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Cmenu t = menulist.get(i);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(!t.getPermission().contains(role))<strong>continue</strong>;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; EasyUITree e = <strong>new</strong> EasyUITree();</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e.setId(t.getId());</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e.setText(t.getName());</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;EasyUITree&gt; eList2 = <strong>new</strong>ArrayList&lt;EasyUITree&gt;();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;Cmenu&gt; menu2 =dao.query(Cmenu.class, Cnd.where(</span><span style="color:#880000;">&quot;pid&quot;</span><span style="color:#444444;">, </span><span style="color:#880000;">&quot;=&quot;</span><span style="color:#444444;">, t.getId()).asc(</span><span style="color:#880000;">&quot;id&quot;</span><span style="color:#444444;">));</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>for</strong> (<strong>int</strong> j = </span><span style="color:#880000;">0</span><span style="color:#444444;">;j &lt; menu2.size(); j++) {</span><span style="color:#888888;">//</span><span style="font-family:宋体;color:#888888;">二级菜单</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Cmenu t2 = menu2.get(j);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong>(!t2.getPermission().contains(role))<strong>continue</strong>;</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Map&lt;String,Object&gt;attributes = <strong>new</strong> HashMap&lt;String, Object&gt;();</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; attributes.put(</span><span style="color:#880000;">&quot;url&quot;</span><span style="color:#444444;">, t2.getUrl());</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; attributes.put(</span><span style="color:#880000;">&quot;role&quot;</span><span style="color:#444444;">, t2.getPermission());</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; EasyUITree e1 = <strong>new</strong>EasyUITree();</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e1.setAttributes(attributes);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e1.setId(t2.getId()+</span><span style="color:#880000;">&quot;&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e1.setText(t2.getName());</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e1.setState(</span><span style="color:#880000;">&quot;open&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; eList2.add(e1);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e.setChildren(eList2);</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; e.setState(</span><span style="color:#880000;">&quot;closed&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; eList.add(e);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>return</strong> Json.toJson(eList);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;"> }</span></span></p><p><span style="color:#444444;background:#F0F0F0;"><span style="font-size:18px;">&nbsp;</span></span></p></td>
        </tr>
        <tr>
          <td class="col0">3.8.4 加载Tree型菜单栏目</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;"></p><p><span style="font-family:宋体;">使用以下代码中的</span>$(“#menutree”).tree()<span style="font-family:宋体;">，在网页左侧</span>(west)<span style="font-family:宋体;">动态加载树形菜单，菜单数据来源于后台以</span>json<span style="font-family:宋体;">形式封装的层级菜单数据。</span></p><p><span style="font-family:宋体;">如果点击一个菜单项，则在</span>tab<span style="font-family:宋体;">中打开相应的页面</span>swNewTab(node.text,“${ctxPath}”+node.attributes.url)<span style="font-family:宋体;">，并在标签上面显示相应的名称</span>node.text<span style="font-family:宋体;">；</span></p><p><span style="font-family:宋体;">如果点击一个父级菜单，则折叠</span>collapse<span style="font-family:宋体;">其它打开的父级菜单，然后展开</span>expand<span style="font-family:宋体;">当前点击的父级菜单，显示其下属的二级菜单项。</span></p><p><span style="color:#444444;">var opened_node;</span></p><p><span style="color:#444444;">$(</span><span style="color:#880000;">&quot;#menutree&quot;</span><span style="color:#444444;">).tree(</span></p><p><span style="color:#444444;">{</span></p><p><span style="color:#444444;"> url : </span><span style="color:#880000;">&quot;${ctxPath}/menutree&quot;</span><span style="color:#444444;">,</span></p><p><span style="color:#444444;"> animate : </span><span style="color:#78A960;">true</span><span style="color:#444444;">,</span></p><p><span style="color:#444444;"> onClick : <strong>function</strong>(node) {</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong> (!node.attributes) {</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong>if</strong> (!opened_node) {</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;$(</span><span style="color:#880000;">&quot;#menutree&quot;</span><span style="color:#444444;">).tree(</span><span style="color:#880000;">'expand'</span><span style="color:#444444;">,node.target);</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;opened_node = node.target;</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } <strong>elseif</strong> (opened_node != node.target) {</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;$(</span><span style="color:#880000;">&quot;#menutree&quot;</span><span style="color:#444444;">).tree(</span><span style="color:#880000;">'collapse'</span><span style="color:#444444;">,opened_node);</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;$(</span><span style="color:#880000;">&quot;#menutree&quot;</span><span style="color:#444444;">).tree(</span><span style="color:#880000;">'expand'</span><span style="color:#444444;">,node.target);</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;opened_node = node.target;</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } <strong>else</strong> {</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; swNewTab(node.text,</span><span style="color:#880000;">&quot;${ctxPath}&quot;</span><span style="color:#444444;"> +node.attributes.url);</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="color:#444444;"> },</span></p><p><span style="color:#444444;"> onLoadSuccess : <strong>function</strong>(node, data) {</span></p><p><span style="color:#444444;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(</span><span style="color:#880000;">&quot;#menutree&quot;</span><span style="color:#444444;">).tree(</span><span style="color:#880000;">'expandAll'</span><span style="color:#444444;">);</span></p><p><span style="color:#444444;"> }</span></p><p><span style="color:#444444;">});</span></p><p>&nbsp;</p><br /><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;"><br /></p><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">运行项目，登录后台查看，是否在布局左边正常显示菜单栏目，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">3-34&nbsp;</span>所示。</p><p style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 45pt; font-family: times new roman serif; font-size: 9pt" line-height:="" 10pt="" text-align:="" center=""><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_053.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 47pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: times new roman serif; font-size: 9pt">3-34 Tree&nbsp;</span>型菜单</p>  </td>
        </tr>
        <tr>
          <td class="col0">3.8.5 后端新闻业务逻辑</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>cn.lrw.newsnutz.module<span style="font-family:宋体;">包中，创建新闻信息的业务逻辑处理类</span>NewsAct<span style="font-family:宋体;">，可能要用到公有方法，则继承</span>BaseAct<span style="font-family:宋体;">类；在类名前添加注解</span>@IocBean<span style="font-family:宋体;">、类的入口注解</span>@At(“/news”)<span style="font-family:宋体;">、登录过滤器</span>@Filters({@By(type=LoginFilter.class)})<span style="font-family:宋体;">，注入</span>dao<span style="font-family:宋体;">对象，添加对新闻的增删改查业务处理方法。</span></span></p><p><span style="color:#646464;"><span style="font-size:18px;">@IocBean</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@At</span>(<span style="color:#2A00FF;">&quot;/news&quot;</span>)</span></p><p><span style="font-size:18px;"><span style="color:#646464;">@Filters</span>({<span style="color:#646464;">@By</span>(type=LoginFilter.<strong><span style="color:#7F0055;">class</span></strong>)})</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">class</span></strong>NewsAct <strong><span style="color:#7F0055;">extends</span></strong> BaseAct {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Inject</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">protected</span></strong> Dao <span style="color:#0000C0;">dao</span>;</span></p><p><span style="font-family:宋体;"><span style="font-size:18px;">注意：</span></span></p><p><span style="font-size:18px;">(1)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">提交新闻的日期时间在服务器生成，避免由于客户端的设备时间有误带来日期时间的不一致性。</span></span></p><p><span style="font-size:18px;">(2)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">只要用户请求阅读一条新闻，则将该新闻的阅读量增加</span>1<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;">1. <span style="font-family:楷体_GB2312;">添加新闻</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>1<span style="font-family:宋体;">）请求跳转到添加新闻的页面</span>newsadd.html<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;beetl:web/newsadd.html&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">void</span></strong> goAdd(HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>2<span style="font-family:宋体;">）保存新闻。接收用户在前端页面</span>newsadd.html<span style="font-family:宋体;">添加的新闻信息，</span><a href="mailto:%E5%8F%82%E6%95%B0@Param(%22..%22)"><span style="font-family:宋体;">参数</span>@Param(&quot;..&quot;)</a><span style="font-family:宋体;">中的</span>”..”<span style="font-family:宋体;">表示对象，</span><span style="font-family:宋体;">补充发布时间和阅读量（默认为</span>0<span style="font-family:宋体;">），然后保存到数据库。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;raw&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span></strong> String saveAdd(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;..&quot;</span>)News<span style="color:#6A3E3E;">news</span>,HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest<span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">try</span></strong>{</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">news</span>.setTjdate(<strong><span style="color:#7F0055;">new</span></strong> Date());</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">news</span>.setHitnum(0);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#0000C0;">dao</span>.insert(<span style="color:#6A3E3E;">news</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<strong><span style="color:#7F0055;">catch</span></strong>(Exception<span style="color:#6A3E3E;">e</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">e</span>.printStackTrace();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong><span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">添加失败</span><span style="color:#2A00FF;">&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong> <span style="color:#2A00FF;">&quot;true&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">2. <span style="font-family:楷体_GB2312;">删除新闻</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">删除指定</span>id<span style="font-family:宋体;">的一条新闻。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;raw&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span></strong> String doDel1(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;id&quot;</span>)<strong><span style="color:#7F0055;">int</span></strong> <span style="color:#6A3E3E;">id</span>,HttpSession<span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(<span style="color:#0000C0;">dao</span>.delete(News.<strong><span style="color:#7F0055;">class</span></strong>,<span style="color:#6A3E3E;">id</span>)&gt;0)<strong><span style="color:#7F0055;">return</span></strong><span style="color:#2A00FF;">&quot;true&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong> <span style="color:#2A00FF;">&quot;false&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">3. <span style="font-family:楷体_GB2312;">修改新闻</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>1<span style="font-family:宋体;">）请求跳转到修改新闻的页面</span>newsedit.html<span style="font-family:宋体;">，同时从数据库获取指定</span>id<span style="font-family:宋体;">的新闻信息，通过</span>request<span style="font-family:宋体;">带回前端页面。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;beetl:web/newsedit.html&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">void</span></strong> goEdit(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;id&quot;</span>)<strong><span style="color:#7F0055;">int</span></strong><span style="color:#6A3E3E;">id</span>,HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest<span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; News <span style="color:#6A3E3E;">news</span>=<span style="color:#0000C0;">dao</span>.fetch(News.<strong><span style="color:#7F0055;">class</span></strong>,<span style="color:#6A3E3E;">id</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">req</span>.setAttribute(<span style="color:#2A00FF;">&quot;news&quot;</span>, <span style="color:#6A3E3E;">news</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>2<span style="font-family:宋体;">）保存修改后的新闻。接收用户在前端页面</span>newsedit.html<span style="font-family:宋体;">修改的新闻信息，更新到数据库。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;raw&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span></strong> StringsaveEdit(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;..&quot;</span>)News<span style="color:#6A3E3E;">news</span>,HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest<span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">try</span></strong>{</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">news</span>.setTjdate(<strong><span style="color:#7F0055;">null</span></strong>);<span style="color:#3F7F5F;">//</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(<span style="color:#0000C0;">dao</span>.updateIgnoreNull(<span style="color:#6A3E3E;">news</span>)==1)<strong><span style="color:#7F0055;">return</span></strong> <span style="color:#2A00FF;">&quot;true&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">else</span><span style="color:#7F0055;">return</span></strong> <span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">修改失败</span><span style="color:#2A00FF;">&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<strong><span style="color:#7F0055;">catch</span></strong>(Exception<span style="color:#6A3E3E;">e</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">e</span>.printStackTrace();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong><span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">修改失败</span><span style="color:#2A00FF;">&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">4. <span style="font-family:楷体_GB2312;">查询新闻</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">如果允许没有登录后台的用户查看新闻，需要在相应方法前面添加注解</span>@Filters()<span style="font-family:宋体;">，暂时屏蔽类前的</span>LoginFilter<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;raw&quot;</span>)<span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">新闻数量</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Filters</span>()</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">int</span></strong> getCount(HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong> <span style="color:#0000C0;">dao</span>.count(News.<strong><span style="color:#7F0055;">class</span></strong>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;beetl:web/newslist.html&quot;</span>)<span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">跳转到新闻信息列表</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">void</span></strong> goList(HttpSession <span style="color:#6A3E3E;">session</span>, HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;beetl:web/newsread.html&quot;</span>)<span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">阅读指定</span><span style="color:#3F7F5F;">id</span><span style="font-family:宋体;color:#3F7F5F;">的新闻内容</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Filters</span>()</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">void</span></strong>getNews(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;id&quot;</span>)<strong><span style="color:#7F0055;">int</span></strong> <span style="color:#6A3E3E;">id</span>,HttpSession<span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; News <span style="color:#6A3E3E;">news</span> = <span style="color:#0000C0;">dao</span>.fetch(News.<strong><span style="color:#7F0055;">class</span></strong>,<span style="color:#6A3E3E;">id</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">int</span></strong> <span style="color:#6A3E3E;">hitnum</span>=<span style="color:#6A3E3E;">news</span>.getHitnum()+1;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">news</span>.setHitnum(<span style="color:#6A3E3E;">hitnum</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#0000C0;">dao</span>.updateIgnoreNull(<span style="color:#6A3E3E;">news</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">req</span>.setAttribute(<span style="color:#2A00FF;">&quot;news&quot;</span>, <span style="color:#6A3E3E;">news</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="color:#646464;"><span style="font-size:18px;">@At</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;raw&quot;</span>)<span style="color:#3F7F5F;">//</span><span style="font-family:宋体;color:#3F7F5F;">分页查询指定新闻或所有新闻</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@Filters</span>()</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span></strong> String listNews(<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;page&quot;</span>)<strong><span style="color:#7F0055;">int</span></strong> <span style="color:#6A3E3E;">curPage</span>,<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;rows&quot;</span>)<strong><span style="color:#7F0055;">int</span></strong> <span style="color:#6A3E3E;">pageSize</span>,<span style="color:#646464;">@Param</span>(<span style="color:#2A00FF;">&quot;s_name&quot;</span>)String <span style="color:#6A3E3E;">s_name</span>, HttpSession <span style="color:#6A3E3E;">session</span>) {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; Criteria <span style="color:#6A3E3E;">cri</span> = Cnd.<em>cri</em>();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong> (!Strings.<em>isBlank</em>(<span style="color:#6A3E3E;">s_name</span>)) {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">cri</span>.where().andLike(<span style="color:#2A00FF;">&quot;title&quot;</span>, <span style="color:#6A3E3E;">s_name</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">else</span></strong> <span style="color:#6A3E3E;">cri</span>.where().andEquals(<span style="color:#2A00FF;">&quot;1&quot;</span>,1);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">cri</span>.getOrderBy().desc(<span style="color:#2A00FF;">&quot;id&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong> listPageJson(<span style="color:#0000C0;">dao</span>, News.<strong><span style="color:#7F0055;">class</span></strong>,<span style="color:#6A3E3E;">curPage</span>,<span style="color:#6A3E3E;">pageSize</span>,<span style="color:#6A3E3E;">cri</span>);</span></p><p><span style="font-size:18px;">}</span></p></td>
        </tr>
        <tr>
          <td class="col0">3.8.6 封装DataGrid数据</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">为了能让前端</span>easyuidatagrid<span style="font-family:宋体;">获取正确的数据，在</span>BaseAct<span style="font-family:宋体;">中添加</span>listPageJson<span style="font-family:宋体;">方法，从数据库按查询条件</span>cnd<span style="font-family:宋体;">获取数据后，再次封装成包含当前页码</span>curPage<span style="font-family:宋体;">、每页新闻数量</span>pageSize<span style="font-family:宋体;">、新闻列表</span>List&lt;News&gt;<span style="font-family:宋体;">等信息的</span>JSON<span style="font-family:宋体;">格式数据。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span></strong> &lt;T&gt;String listPageJson(Dao <span style="color:#6A3E3E;">dao</span>, Class&lt;T&gt; <span style="color:#6A3E3E;">obj</span>, <strong><span style="color:#7F0055;">int</span></strong><span style="color:#6A3E3E;">curPage</span>, <strong><span style="color:#7F0055;">int</span></strong><span style="color:#6A3E3E;">pageSize</span>, Condition <span style="color:#6A3E3E;">cnd</span>){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Map&lt;String, Object&gt; <span style="color:#6A3E3E;">jsonobj</span>= <strong><span style="color:#7F0055;">new</span></strong> HashMap&lt;String,Object&gt;();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Pager <span style="color:#6A3E3E;">pager</span> = <span style="color:#6A3E3E;">dao</span>.createPager(<span style="color:#6A3E3E;">curPage</span>,<span style="color:#6A3E3E;">pageSize</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; List&lt;T&gt; <span style="color:#6A3E3E;">list</span>= <span style="color:#6A3E3E;">dao</span>.query(<span style="color:#6A3E3E;">obj</span>,<span style="color:#6A3E3E;">cnd</span>, <span style="color:#6A3E3E;">pager</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">pager</span>.setRecordCount(<span style="color:#6A3E3E;">dao</span>.count(<span style="color:#6A3E3E;">obj</span>, <span style="color:#6A3E3E;">cnd</span>));</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">jsonobj</span>.put(<span style="color:#2A00FF;">&quot;total&quot;</span>, <span style="color:#6A3E3E;">pager</span>.getRecordCount());</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">jsonobj</span>.put(<span style="color:#2A00FF;">&quot;rows&quot;</span>, <span style="color:#6A3E3E;">list</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return</span></strong> Json.<em>toJson</em>(<span style="color:#6A3E3E;">jsonobj</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;</span></p></td>
        </tr>
        <tr>
          <td class="col0">3.8.7 后端文件上传</td>
          <td class="col1"><p><span style="font-family:宋体;"><span style="font-size:18px;">由于前端发布新闻时，可能需要上传文件，比如图片、附件，后端必须有相应的响应方法，实现上传的文件写到服务器上指定的文件夹中。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>cn.lrw.newsnutz.utils<span style="font-family:宋体;">中创建</span>FileAct<span style="font-family:宋体;">类，封装对上传文件数据的获取、生成新的文件名、按上传日期创建文件夹分类存储到服务器磁盘中。</span></span></p><p><span style="font-family:宋体;"><span style="font-size:18px;">拟采用<strong>百度编辑器</strong>，所以上传的文件存储到服务器上磁盘的方法，只针对这个编辑器，存储的具体位置由配置文件指定。其它在线编辑器，有相似的使用方法，可以参考百度编辑器，灵活使用。</span></span></p><p><span style="color:#646464;"><span style="font-size:18px;">@IocBean</span></span></p><p><span style="font-size:18px;"><span style="color:#646464;">@At</span>(<span style="color:#2A00FF;">&quot;/file&quot;</span>)</span></p><p><span style="font-size:18px;"><span style="color:#646464;">@Filters</span>({<span style="color:#646464;">@By</span>(type=LoginFilter.<strong><span style="color:#7F0055;">class</span></strong>)})</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">class</span></strong>FileAct {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@At</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#646464;">@Ok</span>(<span style="color:#2A00FF;">&quot;raw&quot;</span>)</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">public</span> <span style="color:#7F0055;">void</span></strong> bdupfile(HttpSession <span style="color:#6A3E3E;">session</span>,HttpServletRequest <span style="color:#6A3E3E;">req</span>,HttpServletResponse <span style="color:#6A3E3E;">res</span>)<strong><span style="color:#7F0055;">throws</span></strong> IOException{</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">req</span>.setCharacterEncoding(<span style="color:#2A00FF;">&quot;utf-8&quot;</span> );</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">res</span>.setHeader(<span style="color:#2A00FF;">&quot;Content-Type&quot;</span> , <span style="color:#2A00FF;">&quot;text/html&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; String <span style="color:#6A3E3E;">rootPath</span> =Mvcs.<em>getServletContext</em>().getRealPath( <span style="color:#2A00FF;">&quot;/&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; PrintWriter <span style="color:#6A3E3E;">out</span> = <span style="color:#6A3E3E;">res</span>.getWriter();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#6A3E3E;">out</span>.write( <strong><span style="color:#7F0055;">new</span></strong> ActionEnter( <span style="color:#6A3E3E;">req</span>,<span style="color:#6A3E3E;">rootPath</span> ).exec() );</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">}</span></p></td>
        </tr>
        <tr>
          <td class="col0">3.8.8 修改UEditorl.5</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 9pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; line-height: 28px;">从官网下载&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">UEditor1.5.0&nbsp;</span>开发版源码。在&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">MyEclipse&nbsp;</span>中新建一个&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">Java Project</span>，假定命名为&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">ueditor1.5.0</span>，如图&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">3-35&nbsp;</span>所示。把&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">UEditor1.5.0&nbsp;</span>源码包中&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">jsp/src&nbsp;</span>里面的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: Times New Roman, serif; font-size: 18px;">package&nbsp;</span>包放进项目<span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">ueditor1.5.0&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">的&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">src&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">中，修改&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">com.baidu.ueditor&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">包中的&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">ConfigManager.java&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">文件，在它的&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">initEnv&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">方法中添加图&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">3-35&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">右侧所示框中的代码，这些代码影响配置文件&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">config.json&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">中上传文件的路 径。导出项目为&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">jar&nbsp;</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">文件，假定为&nbsp;</span><span style="font-family: Times New Roman, serif; font-size: 18px; text-align: justify;">ueditor1.5.0.jar</span><span class="s5" style="font-size: 18px; text-align: justify; margin: 0px; padding: 0px;">。</span></p><p style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;"><br style="margin: 0px; padding: 0px;" /></p><p style="margin: 0pt; padding: 0px 0px 0px 7pt; font-family: Times New Roman, serif; font-size: 9pt; line-height: 10pt; text-align: center;"><span style="margin: 0px; padding: 0px;"><img th:src="@{/assets/javaeeimg/Image_054.png}" style="margin: 0px; padding: 0px;" alt="" /></span></p><p class="s9" style="margin: 0pt; padding: 4pt 0px 0px 166pt; font-family: 宋体; font-size: 9pt; text-align: center;">图&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">3-35&nbsp;</span>修改&nbsp;<span class="p" style="margin: 0pt; padding: 0px; font-family: Times New Roman, serif; font-size: 9pt;">ueditor1.5.0</span></p> </td>
        </tr>
        <tr>
          <td class="col0">3.8.9 后台新闻信息处理</td>
          <td class="col1"><p class="s5" style="padding: 9pt 0px 0px 26pt; font-size: 18px;">实现后台添加、删除、修改和查询新闻信息的前端页面。</p></td>
        </tr>
        <tr>
          <td class="col0">1.后台新闻列表</td>
          <td class="col1"><p><span style="font-size:18px;">1. <span style="font-family:楷体_GB2312;">后台新闻列表</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>WebRoot\WEB-INF\web<span style="font-family:宋体;">中创建</span>newslist.html<span style="font-family:宋体;">页面，使用</span>datagrid<span style="font-family:宋体;">呈现新闻列表信息，在页面上可以查询新闻、可以请求跳转到修改新闻的页面、可以请求删除新闻，如图</span>3-36<span style="font-family:宋体;">、图</span>3-37<span style="font-family:宋体;">所示。引入的</span>js<span style="font-family:宋体;">和</span>css<span style="font-family:宋体;">样式文件，基本与</span>admin.html<span style="font-family:宋体;">相同，所以可以用复制页面、修改页面的方法，提高页面的创建效率。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_055.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-36<span style="font-family:宋体;">后台新闻列表</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_056.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-37<span style="font-family:宋体;">后台查询新闻</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">主要</span>html<span style="font-family:宋体;">代码，以</span>datagrid<span style="font-family:宋体;">呈现新闻列表、在其附属的工具栏中显示一个关键字输入框和一个查询按钮：</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">table</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;dg&quot;</span></em> <u><span style="color:#7F007F;">cellpadding</span></u>=<em><span style="color:#2A00FF;">&quot;2&quot;</span></em> <span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">table</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;tb&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">padding</span>:<em><span style="color:#2A00E1;">5px</span></em>;&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">input</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;s_name&quot;</span></em> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-textbox&quot;</span></em><span style="color:#7F007F;">data-options</span>=<em><span style="color:#2A00FF;">&quot;prompt:'</span><span style="font-family:宋体;color:#2A00FF;">标题关键字</span><span style="color:#2A00FF;">...'&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">200px</span></em>;<span style="color:#7F007F;">height</span>:<em><span style="color:#2A00E1;">32px</span></em>&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">a</span><span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;s_news&quot;</span></em><span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;#&quot;</span></em><span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-linkbutton&quot;</span></em><span style="color:#7F007F;">data-options</span>=<em><span style="color:#2A00FF;">&quot;iconCls:'icon-search'&quot;</span></em><span style="color:teal;">&gt;</span><span style="font-family:宋体;">查询</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">a</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">主要</span>js<span style="font-family:宋体;">代码如下，实现</span>datagrid<span style="font-family:宋体;">中新闻数据的动态分页加载，执行查询、删除和修改。需要注意以下几个方面：</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>1<span style="font-family:宋体;">）父级消息框。</span>js <span style="font-family:宋体;">代码用到形如</span>parent.$.messager <span style="font-family:宋体;">的写法，主要作用是弹出父级页面中的</span>easyui <span style="font-family:宋体;">消息框，不是当前页面</span>(iframe)<span style="font-family:宋体;">中的消息框。优势是，以模态窗口弹出的消息框遮挡整个页面（包括父级</span>layout <span style="font-family:宋体;">和当前</span>iframe<span style="font-family:宋体;">），用户只能操作弹出的消息框，不能操作页面上其它内容，这种使用方法在后面的开发过程中还会出现很多次。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>2<span style="font-family:宋体;">）长标题自动折断。当标题太长时，如果在一行全部显示，会破坏页面布局效果。所以希望标题太长时，自动根据显示宽度折断，但当鼠标移动到该标题上时，显示完整的标题内容，效果如图</span>3-38<span style="font-family:宋体;">所示。解决方案是，对于标题的显示特殊处理，一是修改样式，实现过长自动折断，修改</span>easyui.css<span style="font-family:宋体;">中</span>.datagrid-cell<span style="font-family:宋体;">样式，添加属性和值</span>text-overflow: ellipsis<span style="font-family:宋体;">，二是增加元素的</span>title<span style="font-family:宋体;">属性（</span><span style="background:white;">'&lt;spantitle='+ value+ '&gt;' + (value?value:'')+'&lt;/span&gt;'</span><span style="font-family:宋体;">），鼠标指针</span>hover<span style="font-family:宋体;">时，自动显示完整标题。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_057.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-38<span style="font-family:宋体;">长标题自动折断</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>3<span style="font-family:宋体;">）当焦点在</span>id<span style="font-family:宋体;">为</span>tb<span style="font-family:宋体;">的</span>div<span style="font-family:宋体;">元素中时，按下回车键，即进行查询</span><span style="background:white;">$(<span style="color:#2A00FF;">&quot;#tb&quot;</span>).bind(<span style="color:#2A00FF;">&quot;keydown&quot;</span>,<strong><span style="color:#7F0055;">function</span></strong>(e){</span>…})<span style="font-family:宋体;">；如果焦点</span>tb<span style="font-family:宋体;">以外，按下回车键不会执行查询操作。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">var </span></strong><span style="background:white;">s_name=<span style="color:#2A00FF;">&quot;&quot;</span>,id=<span style="color:#2A00FF;">&quot;&quot;</span>,title=<span style="color:#2A00FF;">&quot;&quot;</span>;</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">function </span></strong><span style="background:white;">loadGrid(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; s_name=$(<span style="color:#2A00FF;">&quot;#s_name&quot;</span>).val();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#dg&quot;</span>).datagrid({</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width:800,height:500,nowrap:<strong><span style="color:#7F0055;">false</span></strong>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; striped:<strong><span style="color:#7F0055;">true</span></strong>,border:<strong><span style="color:#7F0055;">true</span></strong>,collapsible:<strong><span style="color:#7F0055;">false</span></strong>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url:<span style="color:#2A00FF;">&quot;${ctxPath}/news/listNews&quot;</span>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; queryParams:{<span style="color:#2A00FF;">&quot;s_name&quot;</span>:s_name},</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pagination:<strong><span style="color:#7F0055;">true</span></strong>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; rownumbers:<strong><span style="color:#7F0055;">true</span></strong>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fitColumns:<strong><span style="color:#7F0055;">true</span></strong>,pageSize:20,</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; loadMsg:'</span><span style="font-family:宋体;background:white;">数据加载中</span><span style="background:white;">...' ,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; columns:[[</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {title:'</span><span style="font-family:宋体;background:white;">标题</span><span style="background:white;">', field:'title',width:200,formatter: <strong><span style="color:#7F0055;">function</span></strong>(value,row,index){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return </span></strong>'&lt;span</span> style=&quot;white-space: nowrap;&quot;<span style="background:white;"> title='+value+'&gt;'+ (value?value:'')+ '&lt;/span&gt;'; </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }},</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {title:'</span><span style="font-family:宋体;background:white;">发布时间</span><span style="background:white;">', field:'tjdate',width:100},</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {title:'</span><span style="font-family:宋体;background:white;">操作</span><span style="background:white;">', field:'hitnum',width:100, formatter: <strong><span style="color:#7F0055;">function</span></strong>(value,row,index){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var </span></strong>p=<span style="color:#2A00FF;">&quot;&lt;ahref=\&quot;javascript:editNews('&quot;</span>+row.id+<span style="color:#2A00FF;">&quot;')\&quot;&gt;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">修改</span><span style="color:#2A00FF;background:white;">&lt;/a&gt;&quot;</span><span style="background:white;">;</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; p+=<span style="color:#2A00FF;">&quot;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;ahref=\&quot;javascript:delNews('&quot;</span>+row.id+<span style="color:#2A00FF;">&quot;','&quot;</span>+row.title+<span style="color:#2A00FF;">&quot;')\&quot;&gt;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">删除</span><span style="color:#2A00FF;background:white;">&lt;/a&gt;&quot;</span><span style="background:white;">;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return </span></strong>p;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }}</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ]],</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; toolbar:'#tb'</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">function </span></strong><span style="background:white;">editNews(id){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp; parent.swNewTab(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">修改新闻信息</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;${ctxPath}/news/goEdit?id=&quot;</span>+id);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">function </span></strong><span style="background:white;">delNews(newsid,title0){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; id=newsid;title=title0;</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.confirm(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">, <span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">您确认要删除</span><span style="color:#2A00FF;background:white;">“&quot;</span><span style="background:white;">+title+<span style="color:#2A00FF;">&quot;”</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">吗？</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">, <strong><span style="color:#7F0055;">function</span></strong>(r){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if </span></strong>(r){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url:<span style="color:#2A00FF;">&quot;${ctxPath}/news/doDel1&quot;</span>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data:{<span style="color:#2A00FF;">&quot;id&quot;</span>:id},</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type:<span style="color:#2A00FF;">&quot;post&quot;</span>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success:<strong><span style="color:#7F0055;">function</span></strong>(res){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(res==<span style="color:#2A00FF;">&quot;true&quot;</span>){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">您已删除新闻：</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">+title, <span style="color:#2A00FF;">&quot;info&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id=<span style="color:#2A00FF;">&quot;&quot;</span>;s_name=<span style="color:#2A00FF;">&quot;&quot;</span>;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; loadGrid();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<strong><span style="color:#7F0055;">else </span></strong>{</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,res,<span style="color:#2A00FF;">&quot;error&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return false</span></strong>;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error:<strong><span style="color:#7F0055;">function</span></strong>(res){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统错误</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;error&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; })</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;">&nbsp;</span></p><p><span style="background:white;"><span style="font-size:18px;">$(<strong><span style="color:#7F0055;">function</span></strong>(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; loadGrid();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#s_news&quot;</span>).click(<strong><span style="color:#7F0055;">function</span></strong>(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; s_name=$(<span style="color:#2A00FF;">&quot;#s_name&quot;</span>).val();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; loadGrid();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#tb&quot;</span>).bind(<span style="color:#2A00FF;">&quot;keydown&quot;</span>,<strong><span style="color:#7F0055;">function</span></strong>(e){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var </span></strong>theEvent = e || window.event; <span style="color:#3F7F5F;">// </span></span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var</span></strong><span style="background:white;">code = theEvent.keyCode || theEvent.which ||theEvent.charCode;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if </span></strong>(code == 13) { </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#s_news&quot;</span>).click();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">})</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">我们可以设置进入后台管理页面后，默认打开后台新闻列表</span>tab<span style="font-family:宋体;">选项卡，只需在</span>admin.html<span style="font-family:宋体;">页面中添加以下</span>JS<span style="font-family:宋体;">代码。</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">$(<strong>function</strong>(){</span></span></p><p><span style="font-size:18px;"><span style="color:#444444;">swNewTab(</span><span style="color:#880000;">'</span><span style="font-family:宋体;color:#880000;">新闻管理</span><span style="color:#880000;">'</span><span style="color:#444444;">,</span><span style="color:#880000;">&quot;${ctxPath}/news/goList&quot;</span><span style="color:#444444;">);</span></span></p><p><span style="color:#444444;"><span style="font-size:18px;">});</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;</span></span></p> </td>
        </tr>
        <tr>
          <td class="col0">2.百度编辑器</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">添加或修改新闻时，实际上不限于纯文字的发布和修改，通常需要上传图片、视频或者其它文件，需要呈现图文混排的多样性，所以使用普通的</span>textarea<span style="font-family:宋体;">满足不了需求。通常采用在线编辑器，我们选用百度</span>UEditor<span style="font-family:宋体;">富文本</span>web<span style="font-family:宋体;">编辑器，最主要的理由是：开源免费，功能丰富。</span></span></p><p><span style="font-size:18px;">UEditor <span style="font-family:宋体;">是一套开源的在线</span>HTML<span style="font-family:宋体;">编辑器，主要用于让用户在网站上获得所见即所得编辑效果，开发人员可以用</span> UEditor <span style="font-family:宋体;">把传统的多行文本输入框</span>(textarea)<span style="font-family:宋体;">替换为可视化的富文本输入框，涵盖流行富文本编辑器特色功能，独创多种全新编辑操作模式，屏蔽各种浏览器之间的差异。</span>UEditor <span style="font-family:宋体;">使用</span> JavaScript <span style="font-family:宋体;">编写，可以无缝地与</span> Java<span style="font-family:宋体;">、</span>.NET<span style="font-family:宋体;">、</span>PHP<span style="font-family:宋体;">、</span>ASP <span style="font-family:宋体;">等程序集成，比较适合在</span>CMS<span style="font-family:宋体;">、商城、论坛、博客、</span>Wiki<span style="font-family:宋体;">、电子邮件等互联网应用上使用。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>1<span style="font-family:宋体;">）获取资源：可以从官网下载</span>1.4.3.3-UTF8-Jsp<span style="font-family:宋体;">版本</span><span style="font-family:宋体;">完整安装包</span><span style="font-family:宋体;">。如图</span>3-39<span style="font-family:宋体;">所示是</span>Ueditor1.4.3.3 Jsp <span style="font-family:宋体;">版本压缩包内容。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_058.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-39 Ueditor1.4.3.3 Jsp <span style="font-family:宋体;">版本压缩包内容</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>2<span style="font-family:宋体;">）安装资源：</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">u<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">将下载的资源包，解压缩，重命名父级文件夹，如</span>ueditor<span style="font-family:宋体;">，放入</span>include<span style="font-family:宋体;">文件夹中。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_059.png}" alt="" /><img src="http://10.1.13.252:8080/exam/include/xheditor/xheditor_skin/blank.gif" class="wordImage" width="195" height="140" alt="" /><img src="http://10.1.13.252:8080/exam/include/xheditor/xheditor_skin/blank.gif" class="wordImage" width="208" height="236" alt="" />&nbsp;</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-40<span style="font-family:宋体;">安装</span>ueditor<span style="font-family:宋体;">资源到当前项目</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">u<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">将包中</span>ueditor1_4_3_3-utf8-jsp\ueditor\jsp\lib<span style="font-family:宋体;">里面的</span>*.jar<span style="font-family:宋体;">和</span>ueditor1.5.0.jar<span style="font-family:宋体;color:red;">（已在3.8.8中修改并导出）</span><span style="font-family:宋体;">放入</span>WEB-INF\lib<span style="font-family:宋体;">文件夹中。这一项工作，也许在</span>3.2.3<span style="font-family:宋体;">节中已经完成了。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">u<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">将包中</span>jsp<span style="font-family:宋体;">里面的</span>config.json<span style="font-family:宋体;">放入</span>conf<span style="font-family:宋体;">文件夹中。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>3<span style="font-family:宋体;">）修改配置：</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>WebRoot<span style="font-family:宋体;">目录下创建的文件夹</span>upload<span style="font-family:宋体;">作为指定存放上传文件的目录。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">修改</span>ueditor.config.js<span style="font-family:宋体;">文件</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">指定服务器上响应文件上传的方法，其中</span>base<span style="font-family:宋体;">为当前项目</span>path<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;">serverUrl: base+<span style="color:#2A00FF;">&quot;file/bdupfile&quot;</span>,</span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">修改</span>config.json<span style="font-family:宋体;">文件</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">把原始文件中所有默认的上传保存路径</span>/ueditor/jsp/upload/…<span style="font-family:宋体;">全部修改为当前项目设计的路径前缀</span>/upload/…<span style="font-family:宋体;">，例如，图片的上传保存路径修改为：</span></span></p><p><span style="font-size:18px;"><span style="color:green;">&quot;imagePathFormat&quot;</span>: <span style="color:#2A00FF;">&quot;/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}&quot;</span>,</span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>4<span style="font-family:宋体;">）使用样例：</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span><strong><span style="color:#7F0055;">var </span></strong>base=<span style="color:#2A00FF;">&quot;${ctxPath}/&quot;</span>;<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p> <span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em><span style="color:#7F007F;">charset</span>=<em><span style="color:#2A00FF;">&quot;utf-8&quot;</span></em><span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/ueditor/ueditor.config.js&quot;</span></em><span style="color:teal;">&gt; &lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p> <span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">charset</span>=<em><span style="color:#2A00FF;">&quot;utf-8&quot;</span></em><span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/ueditor/ueditor.all.min.js&quot;</span></em><span style="color:teal;">&gt;</span> <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p> <span style="font-size:18px;"><span style="color:#3F5FBF;">&lt;!--</span><span style="font-family:宋体;color:#3F5FBF;">建议手动加在语言，避免在</span><span style="color:#3F5FBF;">ie</span><span style="font-family:宋体;color:#3F5FBF;">下有时因为加载语言失败导致编辑器加载失败</span><span style="color:#3F5FBF;">--&gt;</span></span></p><p> <span style="font-size:18px;"><span style="color:#3F5FBF;">&lt;!--</span><span style="font-family:宋体;color:#3F5FBF;">这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文</span><span style="color:#3F5FBF;">--&gt;</span></span></p><p> <span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em><span style="color:#7F007F;">charset</span>=<em><span style="color:#2A00FF;">&quot;utf-8&quot;</span></em><span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/ueditor/lang/zh-cn/zh-cn.js&quot;</span></em><span style="color:teal;">&gt; &lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p> <span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;editor&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/plain&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">100%</span></em>;<span style="color:#7F007F;">height</span>:<em><span style="color:#2A00E1;">500px</span></em>;&quot;<span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#3F7F5F;">//</span></span><span style="font-family:宋体;color:#3F7F5F;background:white;">实例化编辑器</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">&nbsp;&nbsp;&nbsp;&nbsp; var </span></strong><span style="background:white;">ue = UE.getEditor('editor');</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">更多使用方法，请查看</span>UEditor<span style="font-family:宋体;">文档。</span></span></p><p><span style="font-size:18px;">1)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">可能存在的问题：</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">百度编辑器需要的</span>jar<span style="font-family:宋体;">包有问题。</span>WEB-INF\lib<span style="font-family:宋体;">中缺少需要的</span>jar<span style="font-family:宋体;">包（</span>commons-codec-1.9.jar<span style="font-family:宋体;">、</span>commons-fileupload-1.3.1.jar<span style="font-family:宋体;">、</span>commons-io-2.4.jar<span style="font-family:宋体;">、</span>json.jar<span style="font-family:宋体;">、</span>ueditor-xxx.jar<span style="font-family:宋体;">），或者存在重复</span>jar<span style="font-family:宋体;">包，只是版本号不同，或者只有太旧的版本。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">配置文件的物理路径有问题。比如</span>tomcat<span style="font-family:宋体;">的路径上有空格，或者有中文，运行项目后，配置文件生成到</span>tomcat<span style="font-family:宋体;">的</span>webapps<span style="font-family:宋体;">中，但由于</span>tomcat<span style="font-family:宋体;">的安装路径有特殊字符，导致</span>ueditor<span style="font-family:宋体;">不能正常读取</span>config.json<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">配置文件的编码有问题。确保</span>config.json<span style="font-family:宋体;">文件的编码方式</span>utf-8<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><span style="font-family:宋体;">配置文件的内容有问题。</span>config.json<span style="font-family:宋体;">文件中不能出现“</span>//<span style="font-family:宋体;">”注释符。</span></span></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.添加新闻</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">准备好了</span>ueditor<span style="font-family:宋体;">编辑器，则可以在添加和修改新闻时，采用</span>ueditor<span style="font-family:宋体;">实现图片、动画、附件、视频等文件上传，实现在线图文混排。</span></span></p><p><span style="font-family:宋体;"><span style="font-size:18px;">添加新闻，也是发布新闻的一个基本操作，教学过程中，已经简化了部分功能，忽略了发布时需要选择新闻版块、是否图片新闻、是否置顶等功能。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>WebRoot\WEB-INF\web<span style="font-family:宋体;">中创建</span><strong>newsadd.html</strong><span style="font-family:宋体;">页面，实现新闻的前端添加发布，页面效果如图</span>3-41<span style="font-family:宋体;">所示。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_060.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-41<span style="font-family:宋体;">添加新闻窗口</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>1<span style="font-family:宋体;">）引用文件：</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/css&quot;</span></em><span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/themes/default/easyui.css&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">link</span> <span style="color:#7F007F;">rel</span>=<em><span style="color:#2A00FF;">&quot;stylesheet&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/css&quot;</span></em><span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/themes/icon.css&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;</span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/js/jquery.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/jquery.easyui.min.js&quot;</span></em><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/easyui/locale/easyui-lang-zh_CN.js&quot;</span></em><span style="color:teal;">&gt; &lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span><strong><span style="color:#7F0055;">var </span></strong>base=<span style="color:#2A00FF;">&quot;${ctxPath}/&quot;</span>;<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">charset</span>=<em><span style="color:#2A00FF;">&quot;utf-8&quot;</span></em><span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/ueditor/ueditor.config.js&quot;</span></em><span style="color:teal;">&gt; &lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">charset</span>=<em><span style="color:#2A00FF;">&quot;utf-8&quot;</span></em><span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/ueditor/ueditor.all.min.js&quot;</span></em><span style="color:teal;">&gt;</span> <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/javascript&quot;</span></em> <span style="color:#7F007F;">charset</span>=<em><span style="color:#2A00FF;">&quot;utf-8&quot;</span></em><span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/ueditor/lang/zh-cn/zh-cn.js&quot;</span></em><span style="color:teal;">&gt; &lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>2<span style="font-family:宋体;">）页面主要代码：</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">对应新闻对象的主要属性，其中新闻</span>id<span style="font-family:宋体;">和新闻的发布时间由后端生成，不需要前端输入，所以前端仅提供了新闻标题、新闻内容和新闻发布人的输入，另加一个保存按钮。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-panel&quot;</span></em><span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">padding</span>:<em><span style="color:#2A00E1;">5px 2px</span></em>&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">form</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">table</span> <span style="color:#7F007F;">cellpadding</span>=<em><span style="color:#2A00FF;">&quot;5&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">100px</span></em>;&quot;<span style="color:teal;">&gt;</span><span style="font-family:宋体;">新闻标题：</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span><span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">880px</span></em>;&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">input</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;title&quot;</span></em> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-textbox&quot;</span></em> <span style="color:#7F007F;">data-options</span>=<em><span style="color:#2A00FF;">&quot;prompt:'</span><span style="font-family:宋体;color:#2A00FF;">新闻标题</span><span style="color:#2A00FF;">', required:true&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">90%</span></em>;<span style="color:#7F007F;">height</span>:<em><span style="color:#2A00E1;">32px</span></em>&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;</span><span style="font-family:宋体;">新闻发布者：</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">input</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;cruser&quot;</span></em> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-textbox&quot;</span></em> <span style="color:#7F007F;">value</span>=<em><span style="color:#2A00FF;">&quot;${me.xm}&quot;</span></em><span style="color:#7F007F;">data-options</span>=<em><span style="color:#2A00FF;">&quot;prompt:'</span><span style="font-family:宋体;color:#2A00FF;">发布人</span><span style="color:#2A00FF;">', required:true&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">90%</span></em>;<span style="color:#7F007F;">height</span>:<em><span style="color:#2A00E1;">32px</span></em>&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">vertical-align</span>: <em><span style="color:#2A00E1;">top</span></em>;&quot;<span style="color:teal;">&gt;</span><span style="font-family:宋体;">新闻内容：</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;content&quot;</span></em> <span style="color:#7F007F;">type</span>=<em><span style="color:#2A00FF;">&quot;text/plain&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">89%</span></em>;<span style="color:#7F007F;">height</span>:<em><span style="color:#2A00E1;">300px</span></em>;&quot;<span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">table</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">form</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">text-align</span>:<em><span style="color:#2A00E1;">center</span></em>;&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">a</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;savenews&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;#&quot;</span></em> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;easyui-linkbutton&quot;</span></em> <span style="color:#7F007F;">iconCls</span>=<em><span style="color:#2A00FF;">&quot;icon-ok&quot;</span></em><span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">width</span>:<em><span style="color:#2A00E1;">132px</span></em>;<span style="color:#7F007F;">height</span>:<em><span style="color:#2A00E1;">32px</span></em>&quot;<span style="color:teal;">&gt;</span><span style="font-family:宋体;">保存</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">a</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">（</span>3<span style="font-family:宋体;">）主要</span>JS<span style="font-family:宋体;">代码：</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">实现百度编辑器的创建；新增新闻信息的校验和通过</span>ajax<span style="font-family:宋体;">向后端提交。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">var </span></strong><span style="background:white;">ue;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">$(<strong><span style="color:#7F0055;">function</span></strong>(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; ue = UE.getEditor('content');</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp; $('#savenews').click(<strong><span style="color:#7F0055;">function</span></strong>(){<span style="color:#3F7F5F;">//</span></span><span style="font-family:宋体;color:#3F7F5F;background:white;">发布新闻前，要校验</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var </span></strong><span style="background:white;">a=$(<span style="color:#2A00FF;">&quot;#title&quot;</span>).textbox(<span style="color:#2A00FF;">&quot;getValue&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var </span></strong>b=ue.getContent();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var </span></strong>c=$(<span style="color:#2A00FF;">&quot;#cruser&quot;</span>).textbox(<span style="color:#2A00FF;">&quot;getValue&quot;</span>);</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(a.length&lt;=0){$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">必须填写新闻标题</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;warning&quot;</span>); <strong><span style="color:#7F0055;">return</span></strong>;}</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(b.length&lt;=0){$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">必须填写新闻内容</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;warning&quot;</span>); <strong><span style="color:#7F0055;">return</span></strong>;}</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(c.length&lt;=0){$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">必须填写发布人姓名或者发布机构名称</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;warning&quot;</span>); <strong><span style="color:#7F0055;">return</span></strong>;}</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type:'POST',</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url: <span style="color:#2A00FF;">&quot;${ctxPath}/news/saveAdd&quot;</span>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data: {<span style="color:#2A00FF;">&quot;title&quot;</span>:a,<span style="color:#2A00FF;">&quot;content&quot;</span>:b,<span style="color:#2A00FF;">&quot;cruser&quot;</span>:c},</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success: <strong><span style="color:#7F0055;">function </span></strong>(res) { </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(res==<span style="color:#2A00FF;">&quot;true&quot;</span>){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">你已添加新闻</span><span style="color:#2A00FF;background:white;">:&quot;</span><span style="background:white;">+ $(<span style="color:#2A00FF;">&quot;#title&quot;</span>).val(),<span style="color:#2A00FF;">&quot;info&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<strong><span style="color:#7F0055;">else</span></strong>{</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">添加失败！</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">, <span style="color:#2A00FF;">&quot;error&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return false</span></strong>;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error: <strong><span style="color:#7F0055;">function</span></strong>(res){parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统错误！</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">, <span style="color:#2A00FF;">&quot;error&quot;</span>); }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">});</span></span></p>  </td>
        </tr>
        <tr>
          <td class="col0">4.删除新闻</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">在软件系统中，进行“删除”操作，都有确认步骤，在一定程度上防止不小心误删，如图</span>3-42<span style="font-family:宋体;">所示。删除操作之后，通常会有删除成功或删除失败之类的提示信息。相关实现功能的</span>JS<span style="font-family:宋体;">代码，已在“后台新闻列表”中给出。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_061.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-42<span style="font-family:宋体;">删除新闻</span></span></p>  </td>
        </tr>
        <tr>
          <td class="col0">5.修改新闻</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>WebRoot\WEB-INF\web<span style="font-family:宋体;">中创建</span><strong>newsedit.html</strong><span style="font-family:宋体;">页面，新闻修改页</span>newsedit.html<span style="font-family:宋体;">的内容与新闻添加页基本相同，如页面中最主要的部分是对应</span>news<span style="font-family:宋体;">对象各种属性的输入框；不相同的部分主要体现在：</span></span></p><p><span style="font-size:18px;">(1)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">页面中使用</span>${news.xxx}<span style="font-family:宋体;">接收后端返回的一条新闻</span>news<span style="font-family:宋体;">的各种属性值，页面效果如图</span>3-42<span style="font-family:宋体;">所示。</span></span></p><p><span style="font-size:18px;">(2)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">请求保存的路径不一样</span></span></p><p><span style="font-size:18px;">(3)<span style="font-family: Times New Roman;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="font-family:宋体;">操作结果的提示信息有区别</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_062.png}" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-43<span style="font-family:宋体;">修改新闻窗口</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">主要</span>JS<span style="font-family:宋体;">代码，实现创建百度编辑器、动态加载指定</span>id<span style="font-family:宋体;">新闻信息、校验后保存修改的信息。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">var </span></strong><span style="background:white;">ue;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">$(<strong><span style="color:#7F0055;">function</span></strong>(){</span></span></p><p><span style="background:white;"><span style="font-size:18px;"> ue =UE.getEditor('content');</span></span></p><p><span style="background:white;"><span style="font-size:18px;"> $(<span style="color:#2A00FF;">&quot;#title&quot;</span>).textbox(<span style="color:#2A00FF;">&quot;setValue&quot;</span>,<span style="color:#2A00FF;">&quot;${news.title}&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;"> ue.ready(<strong><span style="color:#7F0055;">function</span></strong>() {</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ue.setContent(<span style="color:#2A00FF;">&quot;&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ue.execCommand('insertHtml','${news.content}');</span></span></p><p><span style="background:white;"><span style="font-size:18px;"> });</span></span></p><p><span style="background:white;"><span style="font-size:18px;"> $(<span style="color:#2A00FF;">&quot;#cruser&quot;</span>).textbox(<span style="color:#2A00FF;">&quot;setValue&quot;</span>,<span style="color:#2A00FF;">&quot;${news.cruser}&quot;</span>);</span></span></p><p><span style="font-size:18px;"><span style="background:white;"> $('#savenews').click(<strong><span style="color:#7F0055;">function</span></strong>(){<span style="color:#3F7F5F;">//</span></span><span style="font-family:宋体;color:#3F7F5F;background:white;">发布新闻前，要校验</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var </span></strong><span style="background:white;">a=$(<span style="color:#2A00FF;">&quot;#title&quot;</span>).textbox(<span style="color:#2A00FF;">&quot;getValue&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var </span></strong>b=ue.getContent();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var </span></strong>c=$(<span style="color:#2A00FF;">&quot;#cruser&quot;</span>).textbox(<span style="color:#2A00FF;">&quot;getValue&quot;</span>);</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(a.length&lt;=0){$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">必须填写新闻标题</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;warning&quot;</span>);<strong><span style="color:#7F0055;">return</span></strong>;}</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(b.length&lt;=0){$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">必须填写新闻内容</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;warning&quot;</span>);<strong><span style="color:#7F0055;">return</span></strong>;}</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(c.length&lt;=0){$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">必须填写发布人姓名或者发布机构名称</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;warning&quot;</span>);<strong><span style="color:#7F0055;">return</span></strong>;}</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type:'POST',</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url: <span style="color:#2A00FF;">&quot;${ctxPath}/news/saveEdit&quot;</span>,</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data: {<span style="color:#2A00FF;">&quot;title&quot;</span>:a,<span style="color:#2A00FF;">&quot;content&quot;</span>:b,<span style="color:#2A00FF;">&quot;cruser&quot;</span>:c,<span style="color:#2A00FF;">&quot;id&quot;</span>:${news.id}},</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success: <strong><span style="color:#7F0055;">function </span></strong>(res) { </span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(res==<span style="color:#2A00FF;">&quot;true&quot;</span>){</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">你已修改新闻</span><span style="color:#2A00FF;background:white;">:&quot;</span><span style="background:white;">+ $(<span style="color:#2A00FF;">&quot;#title&quot;</span>).val(), <span style="color:#2A00FF;">&quot;info&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<strong><span style="color:#7F0055;">else</span></strong>{</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">修改失败！</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;error&quot;</span>);</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">return false</span></strong>;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },</span></span></p><p><span style="font-size:18px;"><span style="background:white;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error: <strong><span style="color:#7F0055;">function</span></strong>(res){parent.$.messager.alert(<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统提示</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;</span></span><span style="font-family:宋体;color:#2A00FF;background:white;">系统错误！</span><span style="color:#2A00FF;background:white;">&quot;</span><span style="background:white;">,<span style="color:#2A00FF;">&quot;error&quot;</span>);}</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; });</span></span></p><p><span style="background:white;"><span style="font-size:18px;"> });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">});</span></span></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.8.10 前台新闻信息处理</td>
          <td class="col1">000</td>
        </tr>
        <tr>
          <td class="col0">1.新闻列表</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">教学中简单化处理，修改系统首页</span>index.html<span style="font-family:宋体;">，使其既有登录功能，还可以查看新闻列表，如图</span>3-44<span style="font-family:宋体;">所示。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_063.png}" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-44<span style="font-family:宋体;">前台新闻列表</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">仍然要处理过长的标题显示效果。新闻标题过长时可以自动截断，并在末尾显示</span>“…”<span style="font-family:宋体;">，避免太长的标题破坏页面外观效果。加载新闻列表时，通常只显示标题和发布日期。新闻条目较多时，通常采用分页控件实现分页效果，继续使用</span>easyui<span style="font-family:宋体;">的控件，如</span>pagination<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">页面仍然使用</span>ajax<span style="font-family:宋体;">技术实现动态加载新闻列表。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">以下是</span>index.html<span style="font-family:宋体;">页面添加的用于显示新闻列表的主要代码，没有提供</span>css<span style="font-family:宋体;">文件，请大家发挥各自的能力，设计实现自己特色（样式）的新闻列表页。</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;lnews&quot;</span></em> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;l-wrap&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;l-news&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;nheader&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">table</span> <span style="color:#7F007F;">cellspacing</span>=<em><span style="color:#2A00FF;">&quot;0&quot;</span></em> <span style="color:#7F007F;">cellpadding</span>=<em><span style="color:#2A00FF;">&quot;0&quot;</span></em><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">tbody</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">h3</span><span style="color:teal;">&gt;</span><span style="font-family:宋体;">通知新闻：</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">h3</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">tbody</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">table</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;nlist&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">table</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;newstable&quot;</span></em> <span style="color:#7F007F;">width</span>=<em><span style="color:#2A00FF;">&quot;100%&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">tbody</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">tr</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;trpp&quot;</span></em><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">td</span> <span style="color:#7F007F;">colspan</span>=<em><span style="color:#2A00FF;">&quot;2&quot;</span></em><span style="color:teal;">&gt;</span> <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">td</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">tr</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">tbody</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">table</span><span style="color:teal;">&gt;</span> </span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;pp&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">background</span>:<em><span style="color:#2A00E1;">#efefef</span></em>;&quot;<span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">为了让登录窗口、新闻列表分别显示，可以在页面</span>body<span style="font-family:宋体;">里面加超链接，实现简单的切换。</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">float</span>:<em><span style="color:#2A00E1;">right</span></em>;<span style="color:#7F007F;">padding-right</span>:<em><span style="color:#2A00E1;">20px</span></em>;&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">a</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;a&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;#&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">margin-right</span>:<em><span style="color:#2A00E1;">15px</span></em>;&quot;<span style="color:teal;">&gt;</span><span style="font-family:宋体;">登录</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">a</span><span style="color:teal;">&gt;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">a</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;b&quot;</span></em> <span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;#&quot;</span></em> <span style="color:teal;">&gt;</span><span style="font-family:宋体;">新闻</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">a</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">页面中实现登录与新闻列表切换、新闻列表内容的动态加载的</span>JS<span style="font-family:宋体;">代码如下。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">首先通过一个</span>ajax<span style="font-family:宋体;">，获取新闻总数</span>(pageTotal)<span style="font-family:宋体;">、加载第</span>1<span style="font-family:宋体;">页的新闻列表</span>(listNews)<span style="font-family:宋体;">、加载</span>easyui<span style="font-family:宋体;">分页器</span>(loadPager)<span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">默认隐藏登录窗口，显示新闻列表。为了能够切换登录窗口和新闻列表窗口，让超链接绑定</span>click<span style="font-family:宋体;">事件。</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">var</span></strong> pageN=1,pageTotal=100;</span></p><p><span style="font-size:18px;">$(<strong><span style="color:#7F0055;">function</span></strong>(){ </span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url:<span style="color:#2A00FF;">&quot;./news/getCount&quot;</span>,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type:<span style="color:#2A00FF;">&quot;post&quot;</span>,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success: <strong><span style="color:#7F0055;">function</span></strong>(res){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pageTotal=parseInt(res);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; listNews(1,10);loadPager();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error:<strong><span style="color:#7F0055;">function</span></strong>(res){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $.messager.alert(<span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">系统提示</span><span style="color:#2A00FF;">&quot;</span>,<span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">系统错误</span><span style="color:#2A00FF;">&quot;</span>,<span style="color:#2A00FF;">&quot;error&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#llogin&quot;</span>).hide();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#a&quot;</span>).click(<strong><span style="color:#7F0055;">function</span></strong>(){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#llogin&quot;</span>).show();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#lnews&quot;</span>).hide();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#b&quot;</span>).click(<strong><span style="color:#7F0055;">function</span></strong>(){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#llogin&quot;</span>).hide();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#lnews&quot;</span>).show();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></p><p><span style="font-size:18px;">});</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">function</span></strong>listNews(pageNumber,pageSize){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $.ajax({</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; url:<span style="color:#2A00FF;">&quot;./news/listNews&quot;</span>,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data:{<span style="color:#2A00FF;">&quot;page&quot;</span>:pageNumber,<span style="color:#2A00FF;">&quot;rows&quot;</span>:pageSize},</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; type:<span style="color:#2A00FF;">&quot;post&quot;</span>,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; success: <strong><span style="color:#7F0055;">function</span></strong>(res){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;.inews&quot;</span>).remove();</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; res=JSON.parse(res);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(res.total&lt;=0){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>tr=<span style="color:#2A00FF;">&quot;&lt;tr class='inews'height=\&quot;25\&quot;&gt;&lt;td &gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tr+=<span style="color:#2A00FF;">&quot;&lt;div class='t'&gt;</span><span style="font-family:宋体;color:#2A00FF;">暂无相关新闻</span><span style="color:#2A00FF;">&lt;/div&gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tr+=<span style="color:#2A00FF;">&quot;&lt;/td&gt;&lt;td width='1%' nowrap=''&gt;&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#trpp&quot;</span>).before(tr);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">else</span></strong>{</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pageN=pageNumber;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pageTotal=res.total;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>rows=res.rows;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">for</span></strong>(<strong><span style="color:#7F0055;">var</span></strong> i=0;i&lt;rows.length;){ </span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong> row=rows[i];</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong> tr=<span style="color:#2A00FF;">&quot;&lt;trclass='inews' height=\&quot;25\&quot;&gt;&lt;td &gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tr+=<span style="color:#2A00FF;">&quot;&lt;div class='t'&gt;&lt;ahref='./news/getNews?id=&quot;</span>+row.id+<span style="color:#2A00FF;">&quot;'target='_blank' title='&quot;</span>+row.title+<span style="color:#2A00FF;">&quot;'&gt;&quot;</span>+row.title+<span style="color:#2A00FF;">&quot;&lt;/a&gt;&lt;/div&gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tr+=<span style="color:#2A00FF;">&quot;&lt;/td&gt;&lt;td width='1%' nowrap=''&gt;&lt;span&gt;&quot;</span>+row.tjdate.substr(0,10)+<span style="color:#2A00FF;">&quot;&amp;nbsp;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#trpp&quot;</span>).before(tr);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; i++;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(i%5==0){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tr=<span style="color:#2A00FF;">&quot;&lt;tr class='inews' height='1'&gt;&lt;tdcolspan='2' align='center'&gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tr+=<span style="color:#2A00FF;">&quot;&lt;hrstyle='border-style:dashed;border-color:#999999;width:99%;height:1px;border-width:1px0px 0px 0px;visibility:inherit'&gt;&lt;/td&gt;&lt;/tr&gt;&quot;</span>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">&quot;#trpp&quot;</span>).before(tr);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; error:<strong><span style="color:#7F0055;">function</span></strong>(res){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; parent.dlg_ok(300,140,<span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">系统提示</span><span style="color:#2A00FF;">&quot;</span>,<span style="color:#2A00FF;">&quot;</span><span style="font-family:宋体;color:#2A00FF;">系统错误</span><span style="color:#2A00FF;">&quot;</span>,<strong><span style="color:#7F0055;">null</span></strong>,<span style="color:#2A00FF;">&quot;error&quot;</span>);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; })</span></p><p><span style="font-size:18px;">}</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;">function</span></strong> loadPager(){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $(<span style="color:#2A00FF;">'#pp'</span>).pagination({</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; total:pageTotal,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pageSize:10,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pageNumber:pageN,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; displayMsg:<span style="color:#2A00FF;">'{from}/{to} </span><span style="font-family:宋体;color:#2A00FF;">共</span><span style="color:#2A00FF;">{total}</span><span style="font-family:宋体;color:#2A00FF;">条</span><span style="color:#2A00FF;">'</span>,</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onSelectPage:<strong><span style="color:#7F0055;">function</span></strong>(pageNumber,pageSize){</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; listNews(pageNumber,pageSize);</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; });</span></p><p><span style="font-size:18px;">}</span></p>  </td>
        </tr>
        <tr>
          <td class="col0">2.新闻阅读</td>
          <td class="col1"><p><span style="font-size:18px;"><span style="font-family:宋体;">在</span>WebRoot\WEB-INF\web<span style="font-family:宋体;">中创建新闻阅读页</span><strong>newsread.html</strong><span style="font-family:宋体;">，用于展示一条新闻的内容，新闻阅读页的内容通常包括：新闻标题、新闻主体内容（图、文、附件链接</span>…<span style="font-family:宋体;">）、日期、来源（发布人或机构）、阅读量，如图</span>3-45<span style="font-family:宋体;">所示。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">为了防止新闻发布时间显示不正常，使用了</span>Beetl<span style="font-family:宋体;">方法简单转换了日期格式</span><strong>${news.tjdate,dateFormat=“yyyy-MM-dd”}</strong><span style="font-family:宋体;">。</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">页面中增加了</span>2<span style="font-family:宋体;">个小小的功能：</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="font-family:宋体;">关闭窗口</span></strong><span style="font-family:宋体;">，实际上是关闭当前页面。</span></span></p><p><span style="font-size:18px;"><span style="font-family:Wingdings;">l<span style="font-family: Times New Roman;">&nbsp; </span></span><strong><span style="font-family:宋体;">返回顶部</span></strong><span style="font-family:宋体;">。如果新闻内容很长，当向下滑动一段距离后，则自动显示</span>“<span style="font-family:宋体;">返回顶部</span>”<span style="font-family:宋体;">的功能。返回顶部的方法有很多种，比如使用</span>jquery.toTop.min.js<span style="font-family:宋体;">也可以实现返回顶部不一样的效果。</span></span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_064.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-45<span style="font-family:宋体;">新闻阅读</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">页面主要</span>html<span style="font-family:宋体;">代码如下，没有提供</span>CSS<span style="font-family:宋体;">代码，请发挥各自能力，实现有特色的新闻阅读页面。</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">background</span>:<em><span style="color:#2A00E1;">#B3DFDA</span></em>;<span style="color:#7F007F;">padding</span>:<em><span style="color:#2A00E1;">0 10px 0 10px</span></em>;<span style="color:#7F007F;">vertical-align</span>:<em><span style="color:#2A00E1;">middle</span></em>;&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">img</span> <span style="color:#7F007F;">src</span>=<em><span style="color:#2A00FF;">&quot;${ctxPath}/include/img/logo.png&quot;</span></em> <span style="color:#7F007F;">width</span>=<em><span style="color:#2A00FF;">&quot;126&quot;</span></em><span style="color:#7F007F;">height</span>=<em><span style="color:#2A00FF;">&quot;50&quot;</span></em><span style="color:teal;">/&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">float</span>:<em><span style="color:#2A00E1;">right</span></em>;<span style="color:#7F007F;">line-height</span>:<em><span style="color:#2A00E1;">50px</span></em>;<span style="color:#7F007F;">margin-right</span>:<em><span style="color:#2A00E1;">10px</span></em>;<span style="color:#7F007F;">font-size</span>: <em><span style="color:#2A00E1;">9pt</span></em>;&quot;<span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;<span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;</span><span style="font-family:宋体;">【</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">a</span> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">color</span>:<em><span style="color:#2A00E1;">blue</span></em>;&quot;<span style="color:#7F007F;">href</span>=<em><span style="color:#2A00FF;">&quot;javascript:window.close();&quot;</span></em><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;</span><span style="font-family:宋体;">关闭窗口</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">a</span><span style="color:teal;">&gt;&lt;</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;</span><span style="font-family:宋体;">】</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;ndetail&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;ntitle&quot;</span></em><span style="color:teal;">&gt;</span>${news.title}<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;nauthor&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span><span style="font-family:宋体;">来源</span>: <span style="color:#2A00FF;">&amp;nbsp;</span><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">strong</span><span style="color:teal;">&gt;</span>${news.cruser}<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">strong</span><span style="color:teal;">&gt;</span> <span style="color:#2A00FF;">&amp;nbsp;&amp;nbsp;</span><span style="font-family:宋体;">发布时间</span>:<span style="color:#2A00FF;">&amp;nbsp; </span><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">strong</span><span style="color:teal;">&gt;</span>${news.tjdate,dateFormat=&quot;yyyy-MM-dd&quot;}<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">strong</span><span style="color:teal;">&gt;</span><span style="color:#2A00FF;">&amp;nbsp;&amp;nbsp;</span><span style="font-family:宋体;">访问量</span>:<span style="color:#2A00FF;">&amp;nbsp;</span><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">strong</span><span style="color:teal;">&gt; </span>[<span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;</span>${news.hitnum}<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">span</span><span style="color:teal;">&gt;</span>]<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">strong</span><span style="color:teal;">&gt;&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span><span style="color:#7F007F;">class</span>=<em><span style="color:#2A00FF;">&quot;nbody&quot;</span></em><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;vsb_content&quot;</span></em><span style="color:teal;">&gt;</span> ${news.content}<span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span>%include(&quot;totop1.html&quot;){}%&gt;</span></p><p><span style="font-size:18px;"><img th:src="@{/assets/javaeeimg/Image_065.png}" alt="" /></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">图</span>3-46<span style="font-family:宋体;">返回顶部</span></span></p><p><span style="font-size:18px;"><span style="font-family:宋体;">以下为实现<strong>返回顶部</strong>的功能代码，单独创建了一个</span>totop1.html<span style="font-family:宋体;">页面中，然后使用</span>include<span style="font-family:宋体;">包含到</span>newsread.html<span style="font-family:宋体;">页面中，显示效果如图</span>3-46<span style="font-family:宋体;">所示。</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">style</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><em><span style="color:#3F7F7F;">#backtotop</span></em> {</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">width</span>: <em><span style="color:#2A00E1;">24px</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">color</span>: <em><span style="color:#2A00E1;">white</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">padding</span>: <em><span style="color:#2A00E1;">12px 0px 12px 5px</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">display</span>: <em><span style="color:#2A00E1;">none</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">position</span>: <em><span style="color:#2A00E1;">fixed</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">cursor</span>: <em><span style="color:#2A00E1;">pointer</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">text-align</span>: <em><span style="color:#2A00E1;">center</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">z-index</span>: <em><span style="color:#2A00E1;">20</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">background-color</span>: <em><span style="color:#2A00E1;">rgba(0, 188, 212, 0.65)</span></em>;</span></p><p><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#7F007F;">border-radius</span>: <em><span style="color:#2A00E1;">12px 0px 0px 12px</span></em>;</span></p><p><span style="font-size:18px;">}</span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">style</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">div</span> <span style="color:#7F007F;">id</span>=<em><span style="color:#2A00FF;">&quot;backtotop&quot;</span></em> <span style="color:#7F007F;">style</span>=&quot;<span style="color:#7F007F;">right</span>: <em><span style="color:#2A00E1;">0px</span></em>;<span style="color:#7F007F;">display</span>: <em><span style="color:#2A00E1;">none</span></em>;&quot;<span style="color:teal;">&gt;</span><span style="font-family:宋体;">回到顶部</span><span style="color:teal;">&lt;/</span><span style="color:#3F7F7F;">div</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><span style="color:teal;">&lt;</span><span style="color:#3F7F7F;">script</span><span style="color:teal;">&gt;</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">var </span></strong><span style="background:white;">$backtotop = $('#backtotop');</span></span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">var </span></strong><span style="background:white;">toplrw = $(window).height() -$backtotop.height() - 200;</span></span></p><p><span style="font-size:18px;">&nbsp;</span></p><p><span style="font-size:18px;"><strong><span style="color:#7F0055;background:white;">function </span></strong><span style="background:white;">moveBacktotop() {</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(toplrw&lt;0)toplrw=0;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $backtotop.css({ top: toplrw,right: 0});</span></span></p><p><span style="background:white;"><span style="font-size:18px;">}</span></span></p><p><span style="font-size:18px;">&nbsp;</span></p><p><span style="background:white;"><span style="font-size:18px;">$backtotop.click(<strong><span style="color:#7F0055;">function </span></strong>() {</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $('html,body').animate({ scrollTop:0 });</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">returnfalse</span></strong>;</span></span></p><p><span style="background:white;"><span style="font-size:18px;">});</span></span></p><p><span style="background:white;"><span style="font-size:18px;">$(window).scroll(<strong><span style="color:#7F0055;">function </span></strong>() {</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">var</span></strong>windowHeight = $(window).scrollTop();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; <strong><span style="color:#7F0055;">if</span></strong>(windowHeight &gt; 200) {</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $backtotop.fadeIn();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; } <strong><span style="color:#7F0055;">else</span></strong>{</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; $backtotop.fadeOut();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">&nbsp;&nbsp;&nbsp;&nbsp; }</span></span></p><p><span style="background:white;"><span style="font-size:18px;">});</span></span></p><p><span style="font-size:18px;">&nbsp;</span></p><p><span style="background:white;"><span style="font-size:18px;">moveBacktotop();</span></span></p><p><span style="background:white;"><span style="font-size:18px;">$(window).resize(moveBacktotop);</span></span></p><p><span style="font-size:18px;"><span style="color:teal;background:white;">&lt;/</span><span style="color:#3F7F7F;background:white;">script</span><span style="color:teal;background:white;">&gt;</span></span></p>  </td>
        </tr>
        <tr>
          <td class="col0">3.9 考核任务</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 26pt; font-family: 宋体; font-size: 18px;">正确实现新闻信息的增删改查，添加与修改新闻可以上传图片等文件。</p><p class="s5" style="margin: 0pt; padding: 2pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">1</span>）添加新闻。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">20&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">2</span>）修改新闻。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">20&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">3</span>）后台新闻列表。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">20&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">4</span>）删除新闻。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">20&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">5</span>）前台新闻列表。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">10&nbsp;</span>分）</p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 26pt; font-family: 宋体; font-size: 18px;">（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">6</span>）阅读新闻。（<span class="s6" style="margin: 0px; padding: 0px; font-family: Times New Roman, serif; font-size: 18px;">10&nbsp;</span>分）</p> </td>
        </tr>
        <tr>
          <td class="col0">本章小结</td>
          <td class="col1"><p class="s5" style="margin: 0pt; padding: 0px 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; text-align: justify; line-height: 28px;">本章以快速迭代的方法实现项目，后端采用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Nutz&nbsp;</span>框架、前端采用&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">EasyUI&nbsp;</span>框架，详细地介 绍了新闻发布系统的开发过程，循序渐进。从搭建框架项目到添加数据源和主模块、添加日志 系统、添加处理业务逻辑的子模块、添加文件上传功能都有详细介绍；包含后端开发（<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">Java&nbsp;</span>类文件、配置文件）和前端开发（前端页面&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">html&nbsp;</span>编码、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">CSS&nbsp;</span>样式设置、<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">JS&nbsp;</span>前端业务逻辑）；<span style="font-size: 18px;">前端请求通过&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="">Nutz&nbsp;</span><span style="font-size: 18px;">框架的</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="">@At&nbsp;</span><span style="font-size: 18px;">找到后端相应的&nbsp;</span><span class="s6" style="font-size: 18px; margin: 0px; padding: 0px; font-family: " times="" new="" roman="" serif="">Java&nbsp;</span><span style="font-size: 18px;">方法响应。基本上每完成一个功能，就可 以运行测试和使用。</span></p><p class="s5" style="margin: 0pt; padding: 1pt 0px 0px 5pt; text-indent: 21pt; font-family: 宋体; font-size: 18px; text-align: justify; line-height: 28px;">本章强调软件开发人员熟练掌握后端和前端的调试方法，程序调试是分析&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">BUG&nbsp;</span>和解决问 题最直接的能力。没有人能够保证软件写出来不用调试就可以运行正常，也没有人可以保证软 件永远不会出&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">BUG</span>。所以，熟练使用调试器是一个软件开发人员需要具备的基本技能。掌握 调试方法，及时改正软件或程序中发现的&nbsp;<span class="s6" style="margin: 0px; padding: 0px; text-indent: 0px; font-family: " times="" new="" roman="" serif="" font-size:="" 18px="">BUG</span>，有助于软件的正确开发，有助于软件的后续 功能开发，有助于提高软件开发人员的兴趣、提升软件开发的能力。</p>  </td>
        </tr>

		</tbody>
    </table>
<div th:include="include :: footer"></div>
</body>
</html>
